Jump to content

JQuery, PHP, JSON and Ajax


Strider64
Go to solution Solved by Strider64,

Recommended Posts

I hope I put this in the right folder, but if not it can be moved. After spending about two days on the following code I finally have it working.

 

Here's the code (I commented the best that I could):

$(document).ready(function() {
	
  var  d        = new Date(),
  $id      = $('#cmsId'),
  $title   = $('#cmsTitle'),
  $content = $('#cmsContent'),
  saveBtn  = $("#save");
  
  
    $.ajax({ // Start of ajax:
      url: 'data.php?='+d.getTime(),
      timeout: 5000, // Timeout * delay *
      cache: false, // Make sure it doesn't go to cache:
      dataType: "json", // Format type:
      success: function(info) { // Grab the data from php and then display it:

        // Variables * Self-Explanatory *
        var id      = info.id,
        title   = info.title,
        content = info.content;
        
        /* Display Editable Info in Form */
        $id.val(id);     
        $title.val(title);
        $content.append(content);
        
        //console.log('ID', $id, 'Title', $title, 'Content', $content);

      },
      error: function(request, status, error) {
        alert(status + ", " + error);
      }
  	}); // End of ajax call:
  

  saveBtn.click(saveFCN); // Save to database:

  function saveFCN(evt) {
		evt.preventDefault(); // prevent button from firing: 
		
		/* Encode a set of form elements as a string for submission */
		/* For more information goto: http://api.jquery.com/serialize/ */
		var data = $('#sendCMS :input').serialize(); 
		
		/* Save Function by grabbing & sending to location save_data.php */
		$.post($('#sendCMS').attr('action'), data , function(info) { 
			
		$('#debug_message').html(info); // Display the result back when saved:
		
	}); // End of Save:

} // End of Save Function:

}); // End of Doc Ready:

and here's the HTML

    <form id="sendCMS" action="save_data.php" method="post">
      <input type="hidden" name="id" id="cmsId">
    	<label for="cmsTitle" class="cmsLabel">Title</label>
      <input type="text" data-id="1" class="cmsTitle" name="title" id="cmsTitle"><br><br>
      <label for="cmsContent" class="cmsLabel">Content</label><br>
      <textarea class="cmsContent" id="cmsContent" name="content"></textarea>
      
      <button id="save">SAVE</button><br><br>
    </form>
    <div id="debug_message"></div>
    
  </article>

Finally here's my question (Sorry it took this long to get to the point)....I am pretty sure that it's pretty secured for it basically keeps the javascript and php separate. However, I just want to make sure from any security experts that might know different?

 

Here's a small snippet of my php file

$id = htmlspecialchars($_POST['id']);
$title = htmlspecialchars(strip_tags($_POST['title']));
$content = htmlspecialchars($_POST['content']);

// Update the edited text:	 
$query = 'UPDATE  pages SET title=:title, content=:content, dateUpdated=NOW() WHERE id=:id';

// Prepare the Statement:
$stmt = $pdo->prepare($query);

// execute the statement:
$result = $stmt->execute(array('title' => $title, ':content' => $content, ':id' => $id));

if ($result) {
  echo 'Data Successfully Inserted';
} else {
  echo 'Insertion Failed!';
}

As you can see I do you use prepared statments and I like I said the php and jquery (javascript) is separated as much as I could, but I just want to make sure.

 

Thanks in Advanced,

         John

Edited by Strider64
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.