Could someone explain or show me why my Ajax form won't post?. I'm using smarty template engine.
The form
<form action="/ajax/update_details.php" method="post" id="detailsform">
<input type="text" name="city" value="{$profile_user.city}" />
<input type="text" name="profile_message" value="{$profile_user.profile_message}" />
<textarea name="about_me" cols="53" rows="5" class="submit_form_textfield">{$profile_user.about_me}</textarea>
<textarea name="hobbies" cols="53" rows="5" class="submit_form_textfield">{$profile_user.hobbies}</textarea>
<input type="hidden" name="action" value="user_details" />
<input type="submit" class="submit_form_button" value="Update Details" />
<a class="success" style="display: none; color: green; text-align: centera;">Your details have been updated</a>
</form>
Javascript
{literal}
<script type="text/javascript">
$("#detailsform").submit(function() {
var url = "/ajax/update_details.php";
$.ajax({
type: "POST",
url: url,
data: $("#detailsform").serialize(),
success: function(data)
{
$(".success").show(1000);
$(".success").fadeOut(5000);
}
});
return false;
});
</script>
{/literal}
And update_details.php
<?php
session_start();
require_once('../vars.php');
require_once('../includes/user.class.php');
$user = new User();
if (isset($action) && $action=='user_details' && isset($_SESSION['loggeduser_id'])){
$city = preg_replace("/[^a-z]/i","",$_POST['city']);
$profile_message = preg_replace("/[^a-z]/i","",$_POST['profile_message']);
$about_me = ($_POST['about_me']);
$hobbies = ($_POST['hobbies']);
$user->update($_SESSION['loggeduser_id'],array("city" => $city,"profile_message" => $profile_message,"about_me" => $about_me,"hobbies" => $hobbies));
}
?>
Please could someone help me out as i'm new to coding it would be mostly appreciated
Your code is not waiting for the page to load, unless your script is right before </body> you need to use $(document).ready(function() { or $(function(){ or any other valid syntax. NB, it needs closing too.
<script type="text/javascript">
$(document).ready(function() {
$("#detailsform").submit(function(){
// etc
});
});
</script>
Add document ready handler.
$(function(){
$("#detailsform").submit(function() {
//your stuff here....
});
});
Ref: Ajax Form Won't Post