CODEWITHSUNDEEP
phpjavascripthtmlvariables
jakecraige
jakecraige

Reputation: 2727

How do you pass variables to javascript and back from php?

//Javascript
function updateStudentAttendance(event)
  {
    if ($(this).hasClass('here')) {
  $(this).removeClass('here');
  $(this).addClass('absent');
  var schoolId = $(this).children('p').attr('id');
  var studentId = $(this).attr('id');
  var classId = document.getElementById("classId").value;
  postAttendance(studentId, schoolId, classId, 'Absent');
}

function postAttendance(studentId, schoolId, classId, attendanceEvent)
{
  $.post('post_attendance.php', {
  'studentId': studentId,
  'schoolId': schoolId,
  'event': attendanceEvent,
  'classId': classId
}, function(data) {
 // alert(data);
});
}

//php code looks like this:
<?php
    print sprintf('<div id="%s" class="student span2 well well-small %s">
        <input type="hidden" id="classId" name ="classId" value="%s">'
        , $student->getId(), $class, $classId);
    print '<img src="img/userp.png" style="width: 100%; text-align: center;">';
    print sprintf('<p id="%s" style="text-align: center; font-size: 12px;">%s %s'
        , $_GET['schoolId'], $student->getFirstName, $student->getLastSurname());               
    print '</p>';
    print '</div>';
?>

That's the code I'm using which which pulls the information from the id's and I had to add a hidden element to get the classId. I then post it back after it being modified to update the database with the new information. I feel like this is a terribly odd way to do it and would like to have a better solution for passing these variables.

Please let me know a better way to do this. Thanks!

Upvotes: 0

Views: 161

Answers (4)

Wesley Schleumer de G&#243;es
Wesley Schleumer de G&#243;es

Reputation: 6527

You can use an hidden input field and so store a encoded json.

$data = array(
    "key1" => "value1",
    "key2" => "value2"
);
$input = "<input type=\"hidden\" id=\"storage\" value=\"%s\" />";
printf($input, htmlspecialchars(json_encode($data)));

On jQuery

var storage = $.parseJSON($("#storage").val());

Another way is using data attribute, these attributes can be accessed using $("#element").data().

Do some cool changes:

storage["key1"] = "value3";

Back to PHP:

$.post("url.php", storage, function(){
   alert("Alright, bro");
})

Upvotes: 0

soyuka
soyuka

Reputation: 9105

Within your jQuery $.post add some json datatype :

jQuery

 $.post('post_attendance.php', {data:value},
    dataType:"json"
}, function(data) {
   alert(data.error); //will be false
});

Than on your post_attendance.php echo your result with json_encode :

$array = array('response'=>'Some value', error => false);
echo json_encode($array);

Upvotes: 0

Explosion Pills
Explosion Pills

Reputation: 191789

There are two constructs that I think you can make use of.

One is the HTML5 dataset, which allow you to store custom private data for web applications that is not part of the semantics of the markup. This is more flexible than using id because you can only have one id and it has other purposes. You can have multiple classes, but that too is difficult to use.

The second is the hidden attribute, which declares that an element is not relevant to the page's current state / for use by the user. I sometimes use this attribute to create elements that organize application data that is not relevant to the page markup (I hope this is a correct use, though, but I'm not positive).

Upvotes: 0

user669677
user669677

Reputation:

to PHP

using jquery ajax or using form post

to JS

using hidden input fields with json encoded value (if data stracture is complicated)

Upvotes: 2

Related Questions