使用AJAX从PHP检索数据作为HTML

时间:2017-02-02 13:58:39

标签: php ajax

基本上我想在数据库中创建条目后将表单字段添加到现有表单。

形式:

<div class="row">
            <div class="col-md-8 col-md-offset-2">
            <form id="insert_question" method="post" action="">

           <div class="field_wrapper"> //Append Data in this
            ...
                <input type="hidden" name="id[]" id="text1" value="<?php echo $data['id']; ?>">
            ...             
            //Insert data here
            </div>
            </form>                            
            ...
   <button class="btn btn-info btn-block btn-fill add_button">Add More Questions</button> 
//this button I am using to add
    </div>

Ajax:

$('.add_button').click(function() {
    var val1 = $('#text1').val();
    $.ajax({
        type: 'POST',
        url: 'add_question.php',
        data: { text1: val1 },
        dataType: 'html',
        success: function(response) {
            $('#field_wrapper').append(response);
        }
    });
});

add_question.php:

    <?php 

$servername = "localhost";
$username = "root";
$password = "";
$dbname = "coursera";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 


        $section_id = $_POST['text1'];

       $sql = "INSERT INTO quiz VALUES (DEFAULT, 'question','option1','option2','option3','option4','answer','$section_id','$course_id','$instructor_id',DEFAULT)"; 
        if ($conn->query($sql) === TRUE) {
            echo '<div class="form-group"><label>Question <?php echo $m; ?></label><textarea class="form-control" placeholder="Enter your question here.." name="question[]" required=""><?php if($data["question"] != "question") { echo $data["question"];} ?></textarea></div><div class="form-group"><label>Option 1</label><textarea class="form-control" placeholder="Answer Option 1" name="option1[]" required=""><?php if($data["question"] != "question") { echo $data["option1"];} ?></textarea></div><div class="form-group"><label>Option 2</label><textarea class="form-control" placeholder="Answer Option 2" name="option2[]" required=""><?php if($data["question"] != "question") { echo $data["option2"];} ?></textarea></div><div class="form-group"><label>Option 3</label><textarea class="form-control" placeholder="Answer Option 3" name="option3[]" required=""><?php if($data["question"] != "question") { echo $data["option3"];} ?></textarea></div><div class="form-group"><label>Option 4</label><textarea class="form-control" placeholder="Answer Option 4" name="option4[]" required=""><?php if($data["question"] != "question") { echo $data["option4"];} ?></textarea></div><div class="form-group"><label>Correct Answer</label><select class="form-control" name="answer[]" required=""><option value="Option 1">Option 1</option><option value="Option 2">Option 2</option><option value="Option 3">Option 3</option><option value="Option 4">Option 4</option></select></div><br><hr style="border: 1px solid #000;"><br><input type="hidden" name="id[]" value="<?php echo $data["id"]; ?>">';
        } 


    ?>

从php运行查询后,我无法添加回显的html。我想用ajax做,所以我不必刷新页面。

感谢。

2 个答案:

答案 0 :(得分:1)

您键入了ID而不是类。在ajax请求中将all.equal( meanDistByCell(subsetList, pdist, TRUE), meanDistByCell2(subsetList, pdist, TRUE) ) # [1] TRUE 更改为$('#field_wrapper')。在本地测试,它的工作原理。

编辑:另外,在你的ajax succes函数中使用.html()而不是.append()。

答案 1 :(得分:0)

你使用$('#field_wrapper')。append(response);但你使用field_wrapper作为类而不是id ..更改

<div class="field_wrapper"> 

 <div id="field_wrapper">