Question

我有一个包含多个型号的页面。

如果用户在模式中的texbox中更改某些内容，是否可以在不转到新页面的情况下保存点击更改？

以下是一个示例模型：

<div id="myModal6" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel3" aria-hidden="true">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                                    <h3 id="myModalLabel3">Homepage Testimonial</h3>
                                </div>
                                <div class="modal-body">

                               <h5><b>Testimonial: </b></h5>
              <textarea name="hometest" style="width: 500%" height:"150%";><?php echo $hometest ; ?>  </textarea>
              <br><br>

              <h5><b>Testimonial From:</b> </h5><input type="text" name="hometestfrom" value="<?php echo $hometestfrom ; ?>"><br>
                                </div>
                                <div class="modal-footer">
                                    <button class="btn red" data-dismiss="modal" aria-hidden="true">Cancel</button>
                                <a href='index.php'>    <button class="btn green">Save</button></a>
                                </div>
                            </div>

Answer 1

在某处创建一个可调用的php函数：

function saveToDB() { 
  // save logic here, handle data from $_POST array  
}

在你的模态窗口中，将一个onclick =“saveDataInDB（）”添加到Button

<button class="btn green" onclick="saveDataInDB()">Save</button>

然后添加一个javascript，将您需要的数据发布到php脚本

<script>
function saveDataInDB() {
    $.post('urlofphpscripthere',{'somedata': 'somethingfromyourform'},function(){ 
      // callback function, you could eg close your window if everything was saved successfully 
    });
}
</script>

Answer 2

您需要使用Ajax来解决问题.. 为你的按钮添加另一个课程

<button class="btn green submit">Save</button>

然后使用Jquery ajax调用：

<script>
$(document).ready(function () {
   $('.submit').click(function() {
       $.ajax({        
          type:"POST",
          url:"<?php echo 'urPhpFile/urFunction' ?>",
          data:{data u wanna pass},
          dataType:"json", //better to use json encode
          success:function(data)
          {
               //do sth after data returned
          }
          error:function(e)
          {
                // do sth else
          }
        });
   });
});
</script>

单击按钮保存到数据库

2 个答案: