Ask a Question Register Login

php - Values null when passed from another page using modal and jquery

128

I am having problem on passing values into another page using jQuery and modal. So here is my code.

Firing up the modal:

echo "<input type='hidden' data_project='$row[PROJECT_NAME]' data_headmark='$row[HEAD_MARK]' data_id='$row[ID]'></input>";

echo '<button type="button" name="qcreject" id="qcreject" data-toggle="modal" data-target="#qcRejectModal"> 
        <span > '.$row['PROJECT_NAME'].' / <b>'.$_POST["hm"].'</b>/'.$row['ID'].' ~ FAIL</span></button>';

 <div >
          <div >
            <div >
              <div >
               This is the confirmation window to PASS all the Quality Control for, <br/><br/>
               PROJECT : <b>'.$row['PROJECT_NAME'].'</b>
               HEADMARK : <b>'.$row['HEAD_MARK'].'</b>
               ID : <b>'.$row['ID'].'
              </div>
            </div>
          </div><br/>
          <div >
            <div >
             <div >
              <textarea name="reasonForRejection" id="reasonForRejection" placeholder="Reason for rejection" rows="2" required></textarea>
             </div>
            </div>
          </div>
         </div>
         <div >
          <button type="button" data-dismiss="modal">Cancel</button>
          <button type="button" name="rejectbutton" id="rejectbutton" >Confirm REJECT!</button>
         </div>

and when user click the reject button it should pass PROJECT_NAME, HEAD_MARK, ID and values in the textarea to the testClass.php.

jQuery is,

$('#rejectbutton').click(function() {

        $.post("testClass.php",{
        projectName : this.getAttribute("data_project"), 
        headMark : this.getAttribute("data_headmark"),
        id : this.getAttribute("data_id"),
        reasonReject : this.getAttribute("reasonForRejection")});
    });

and inside the testClass.php

    echo 'TEST CLASS WORKS';

$val1 = $_POST["projectName"];
$val2 = $_POST["headMark"];
$val3 = $_POST["id"];
$val4 = $_POST["reasonReject"];

var_dump($val1);
var_dump($val2);
var_dump($val3);
var_dump($val4);

unfortunately all the values I'm getting in the testClass are null

TEST CLASS WORKSstring(0) ""
string(0) ""
string(0) ""
string(0) ""
453

Answer

Solution:

Addid attribute in your hidden field then use that injs like below code.

echo "<input type='hidden' data_project='$row[PROJECT_NAME]' data_headmark='$row[HEAD_MARK]' data_id='$row[ID]' id="data_field" />";

// your codes

$('#rejectbutton').click(function() {
     var myData = $('#data_field');
     $.post("testClass.php",{
     projectName : myData.attr("data_project"), 
     headMark : myData.attr("data_headmark"),
     id : myData.attr("data_id"),
     reasonReject : $("#reasonForRejection").val() 
     });
});
321

Answer

Solution:

Looking at this code:

$('#rejectbutton').click(function() {
    $.post("testClass.php",{
    projectName : this.getAttribute("data_project"), 
    headMark : this.getAttribute("data_headmark"),
    id : this.getAttribute("data_id"),
    reasonReject : this.getAttribute("reasonForRejection")});
});

it assumes, that when the element with id#rejectbutton is clicked, which is:

<button type="button" name="rejectbutton" id="rejectbutton" class="btn btn-danger">Confirm REJECT!</button>

It has the attributes you want on it, but it doesn't. Also, you are trying to get the attributes usinggetAttribute() - why don't you use the jquery method?

this is how you do it. Update your HTML to be like this:

<button
    type="button"
    name="rejectbutton"
    id="rejectbutton"
    class="btn btn-danger" 
    data_project="some project name",
    headMark="some head mark",
    data_id="1234",
    reasonForRejection="some reason here"
    >Confirm REJECT!</button>

Then update your JS to get those attributes in your post request like this:

$('#rejectbutton').click(function() {
    $.post("testClass.php", {
        projectName : $(this).attr('data_project'),
        headMark : $(this).attr('headMark'),
        id : $(this).attr('data_id'),
        reasonReject : $(this).attr('reasonForRejection'),
    });
});

People are also looking for solutions to the problem: php - Froala Editor Image Upload Error

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.