0

I have a table with users and I want when an administrator clicks on an user a box will show at the bottom with user's information which I did, the box shows and AJAX call retrieves the code from the other page, the html/text, but if I use a mysql query to fill the fields with user information from database nothing will show in the fields. For example:

UserID: 3 - will show correctly but
UserID: <?php echo $row[Account]; ?> - will only show as UserID: (empty)

Also, I have a jQuery to show a field when the administrator clicks on the checkbox inside that box, it was working fine until placing the code in the other page and using AJAX to call it, now it doesn't work anymore.

other file containing the code:

<?php
include('../connect.php');
session_start();

  if(!empty($_POST['id'])){

    $dataID = $_POST['id'];
    $accountsAwaitingSQL = "SELECT `ID`, `Account`, `AccountID`, `Email`, `Answer1`, `Answer2`, `Answer3`, `Date` FROM AccountsAwaiting WHERE ID = $dataID";
    $accountsAwaitingResult = mysqli_query($db, $accountsAwaitingSQL);
    $accountsAwaitingRow_cnt = mysqli_num_rows($accountsAwaitingResult);

    $accountArray = array();
        while($row = mysqli_fetch_assoc($accountsAwaitingResult)){
            $accountArray[] = $row;
        }

      foreach($accountArray as $datum){
      echo json_encode("
      <form id='userAnswersForm'>
      <center>
        <b>Account Name</b>: <i><?php echo $datum[Account]; ?></i>.&nbsp; &nbsp; &nbsp; &nbsp;
        <b>Account ID</b>: <i>25</i>.&nbsp; &nbsp; &nbsp; &nbsp;
        <b>Account E-Mail</b>: <i>somedude@hotmail.com</i>.
      </center>
        <hr />

      <center>
        <b><u>Character Story</u></b><br />
        <label class='form-check-label'>
        <input type='checkbox' id='answerOneReasonCheck' class='form-check-input'>
        <small>Check this box if answer is wrong</small>
        </label>
        <div class='form-group' id='answerOneReason1' style='display:none; max-width:350px;'>
          <label for='answerOneReason'>Reason</label>
          <input type='text' class='form-control' id='answerOneReason' maxlength='250' name='answerOneReason'>
        </div>
        <blockquote><small>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus laoreet scelerisque consectetur. Nunc aliquam condimentum nunc, eget rhoncus ipsum ornare sed. Aenean arcu nunc, blandit ac arcu sit amet, euismod accumsan nisl. Cras vehicula odio erat, et scelerisque quam mollis eget. Suspendisse quis orci ullamcorper, suscipit mauris sit amet, posuere nunc. Integer pellentesque, arcu scelerisque cursus malesuada, lectus mauris fermentum elit, ac eleifend purus dolor et lectus. Curabitur dui justo, bibendum non gravida in, dignissim rutrum mauris.</small></blockquote>
        <br /><br />
        <b><u>Please explain our rules for Sexual Roleplay and Robbery</u></b><br />
        <label class='form-check-label'>
        <input type='checkbox' id='answerTwoReasonCheck' class='form-check-input'>
        <small>Check this box if answer is wrong</small>
        </label>
        <div class='form-group' id='answerTwoReason2' style='display:none; max-width:350px;'>
          <label for='answerTwoReason'>Reason</label>
          <input type='text' class='form-control' id='answerTwoReason' maxlength='250' name='answerTwoReason'>
        </div>
        <blockquote><small>Duis dignissim sit amet metus et sagittis. Vivamus hendrerit finibus maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec cursus felis id libero iaculis efficitur. Maecenas tempus eleifend neque. Vestibulum pellentesque lectus eget erat interdum lacinia. Etiam metus libero, tempor eu sem in, convallis faucibus dui. Ut iaculis vehicula est vitae facilisis. Cras vitae nisl ante. In interdum fermentum mauris, et blandit dolor vulputate sed. Donec luctus tincidunt velit, et molestie nibh egestas ac. Proin fringilla ornare fermentum. Vivamus id massa dignissim, ullamcorper ipsum ut, interdum erat. Proin congue dictum enim, lacinia egestas risus auctor nec. Donec et elementum justo. Donec ut diam a lorem sollicitudin maximus.</small></blockquote>
        <br /><br />
        <b><u>Write the definition of Meta Gaming and Power Gaming along with two examples for each</u></b><br />
        <label class='form-check-label'>
        <input type='checkbox' id='answerThreeReasonCheck' class='form-check-input'>
        <small>Check this box if answer is wrong</small>
        </label>
        <div class='form-group' id='answerThreeReason3' style='display:none; max-width:350px;'>
          <label for='answerThreeReason'>Reason</label>
          <input type='text' class='form-control' id='answerThreeReason' maxlength='250' name='answerThreeReason'>
        </div>
        <blockquote><small>Duis pharetra, erat sed tincidunt rhoncus, tellus neque laoreet augue, aliquet convallis nisi nunc eget ante. Fusce vitae justo sed elit congue auctor at et magna. In euismod iaculis eros, eu scelerisque nibh malesuada ut. Aliquam aliquet dolor sapien, a rhoncus neque accumsan ac. Pellentesque facilisis pulvinar turpis, non finibus enim. Suspendisse et massa ut dolor congue dapibus. Duis porttitor tempor ultricies. Sed luctus arcu arcu, vel elementum risus egestas vel. Vivamus vel hendrerit ligula. Fusce vel augue vestibulum, mattis nulla in, vehicula mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam at tellus scelerisque, convallis neque non, eleifend eros. Aliquam sed velit et velit congue maximus.</small></blockquote>
        <br />
        <div class='form-group' style='max-width:350px;'>
          <label for='answerTwoReason'>Reason visible to other Admins</label>
          <input type='text' class='form-control' id='answerTwoReason' maxlength='180'  name='answerTwoReason'>
        </div>
        <center>
          <p>
            <span style='color:orange'>If all the answers are good then don't check any checkbox, if you spot an answer to be wrong
            then please check the box that is under its title and type in the reason for that answer.
            Even if there are no answers wrong you still need to enter a Reason for Admins, if all answers are good then just say something that you think about that player, for example say if you think that the answers are copied or not, if he did very well or not etc.</span>
          </p>
        </center>
        <button type='submit' class='btn btn-block btn-primary'>Submit</button>
      </center>
      </form>
      ");
    }
  }

?>

As you can see in the code above, everything will appear on the first page except Account Name: which will appear as Account Name:. instead of showing the account name in there, so the mysql didn't pick anything...

This is the ajax code:

$(document).ready(function(){
    $("#rowID").click(function(){
        var id = $(this).attr("data-id");

        $.ajax({
            type: "POST",
            dataType: "json",
            contentType:"application\json;charset=utf-8",
            url: "get-data.php",
            data: {id:id},
            success: function(result){
                $("#bodyDisplay").html(result);
            }
        });
    });
});

And this is the code to show the checkbox which doesn't work if I have the checkbox in the get-data.php file.

$('#answerOneReasonCheck').click(function(){
    $("#answerOneReason1").toggle(this.checked);
});

$('#answerTwoReasonCheck').click(function(){
    $("#answerTwoReason2").toggle(this.checked);
});

$('#answerThreeReasonCheck').click(function(){
    $("#answerThreeReason3").toggle(this.checked);
});

The code above is in the accounts.php file and the checkbox is in the get-data.php but I echo the checkbox in the accounts.php file so it should work :?

EDIT 1

I've checked the console and I see this:

error404.000webhost.com/:1 Uncaught SyntaxError: Unexpected token <
error404.000webhost.com/:1 Uncaught SyntaxError: Unexpected token <
error404.000webhost.com/:1 Uncaught SyntaxError: Unexpected token <
DevTools failed to parse SourceMap: http://zgaming.comxa.com/pages/dist/purify.min.js.map

EDIT 2

Fixed it by removing <?php echo ?> and just using $datum[ ]

But the jQuery for the checkboxes are still not working.

EDIT 3

I get this error in console now Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://error404.000webhost.com/?".

  • 2
    Look in the browser console for errors and use the network tab to examine exactly what is sent to the script and what is returned. Before all that though [fix the huge SQL Injection vulnerability you have](http://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php). – Alex K. Apr 28 '17 at 11:34
  • I Think problem is in json_encode, so try to figure out, what json_encode returns/print in your script. – Sanjay Apr 28 '17 at 11:41
  • @AlexK. Hello alex, can you also tell me what is the vulnerability please? Only thing that I do there is use the dataID to get the account information which can't be modified by the user, dataID is the SQL ID of the user. Also, I was using mysqli_real_escape_string to avoid injection, isn't that good enough? – Mister Knuckles Apr 28 '17 at 11:42

1 Answers1

0

Change this statement

<b>Account Name</b>: <i><?php echo $datum[Account]; ?></i>.&nbsp; &nbsp; &nbsp; &nbsp;

to

<b>Account Name</b>: <i>$datum[Account]</i>.&nbsp; &nbsp; &nbsp; &nbsp;

Hope it helps! All the best!

TutorialsBee
  • 101
  • 2
  • 5
  • Hello, thanks alot, it solved by issue but the jQuery is still not working, do you have any idea for that? – Mister Knuckles Apr 28 '17 at 15:54
  • And somehow it just stopped working, nothing is displayed now, nothing at all, the box is just empty. – Mister Knuckles Apr 28 '17 at 16:01
  • For the dynamically generated components like I can see in the success function of Ajax call i.e., $("#bodyDisplay").html(result);. To handle these components you will need .on() in jquery. refer http://api.jquery.com/on/ and http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements – TutorialsBee Apr 28 '17 at 16:06
  • thank you, do you also know why it stopped working with no reason? I worked when I used your example, then I completed other fields too with `$datum[Answer1]` and `$datum[Answer2]` then I refreshed the page, nothing appears in the box now, it is just empty, I removed them and reversed to the working version, still nothing appears... and I get an error that I'll put up in the topic as an edit. – Mister Knuckles Apr 28 '17 at 16:11
  • Check these links, should be helpful for you: http://stackoverflow.com/questions/22631158/resource-interpreted-as-stylesheet-but-transferred-with-mime-type-text-html-see or http://stackoverflow.com/questions/3467404/chrome-says-resource-interpreted-as-script-but-transferred-with-mime-type-text – TutorialsBee Apr 28 '17 at 16:14
  • thanks for that, do you have any idea why it is not working anymore? I really don't understand it just stopped working... `get-data.php 200 xhr jquery-2.2.3.min.js:4 5.4 KB 731 ms` this is what I see in the newtwork tab, thats the file that I call with AJAX but it doesn't show in the box, the box is just empty – Mister Knuckles Apr 28 '17 at 16:18
  • Please check this post http://stackoverflow.com/questions/13866063/jquery-ajax-200-status-yet-mysterious-syntax-error – TutorialsBee Apr 28 '17 at 16:23
  • Just to try, Try removing json_encode and from the ajax remove the datatype and contenttype attributes. Give it a shot. Not sure if it'll work. Lemme know. – TutorialsBee Apr 28 '17 at 16:25