使用Ajax和jQuery将单选按钮值中的ID插入数据库

时间:2014-11-25 15:34:16

标签: javascript php jquery html ajax

我已经使用ajax创建了一个订购系统,但是我在将ajax页面中的id发送到数据库时遇到了问题。

使用下面的代码来获取HTML部分,jquery部分和ajax部分,我希望能找到一个解决方案。

首先是HTML部分。这列出了特定经销商的所有交付物品。经销商ID保存在会话中。

<td class="main" width="10%"><a href="#" id="orderAllocate"><img src="images/users.png" width="25" height="25" border="0" alt=""></a></td>

单击此按钮将打开一个jQuery对话框,其中包含分销商的所有不同员工。代码如下:

$("a#orderAllocate").click(function(e) {
  e.preventDefault();

if($("#Allocate").length > 0) {
    $("#Allocate").remove();
}

$("<div id='Allocate' title='Please Allocate The Order'></div>").dialog({
    autoOpen: true, 
    width:350,
    height:360,
    resizable: false,
    stack: true,
    modal: true,
    open: function(event, ui) {

        $('#Allocate').load("ajax.php?action=allocate_delivery", function (){
            $(this).find('button').button();
        });


         $("#CancelAllocation").button({icons: {primary: "ui-icon-close"}}).live ("click", function() {

            $( "#Allocate" ).dialog('close');

       });


    }

});

});

ajax部分是:

$html = '';

 $allocate_query = tep_db_query("select * from ".  TABLE_DRIVERS ." where distributor_id='" . (int)$distributor_id . "'");


    $html .= '<form id="save_designation">

            <table>      
                <tr>';

 while($allocate = tep_db_fetch_array($allocate_query)){

                $html .= '<ul id="selectable">
                        <li class="ui-state-default"><input type="radio" name="select_driver" value="'.$allocate['driver_id'].'">&nbsp;&nbsp;&nbsp;<img src="./images/arrow_green.gif" alt="" border="0" height="12" width="15">&nbsp;&nbsp;&nbsp;&nbsp;'.$allocate['driver_firstname'].' '.$allocate['driver_surname'].'<br></li>
                    </ul>';

 }

                '</tr>
            </table>';



    $html .= '<br>

              <table>
                <tr>
                    <td align="left"><button id="CancelAllocation" type="button">Cancel</button></td>

                    <td align="right"><button id="saveAllocation" type="button" >Save</button></td>
                </tr>
              </table>
              </form>';


    echo $html;

单击saveAllocation按钮时,我需要或希望系统执行的操作是将单选按钮的值发送到名为TABLE_ORDERS的数据库表。

我该怎么做?

1 个答案:

答案 0 :(得分:0)

如果您使用保存按钮

<button id="saveAllocation" type="button" >Save</button>

并为其创建一个click事件,您可以在其中放置ajax请求。

var saveRadio;
$('#saveAllocation').on("click", function() {
    // Get the selected radio value
    saveRadio = $('input[name="select_driver"]').val();

    $.post("/yourpage.php", {"select_driver":saveRadio}).done(function() {
        // Successful request
    }).fail(function() {
        // Failed request
    }).always(function() {

    });
});

使用done() fail()always()函数,您可以设置您想要发生的事情。

创建一个名为yourpage.php的页面或更改上面jQuery中的路径。

您可以使用$_POST['select_driver']

获取值

您的SQL应该类似于

INSERT INTO table_name(my_column)AS('my_value')

使用PHP运行SQL时。请注意SQL_injection&amp;如何防止它。 tep_db_query似乎是PHP应用程序的书面函数。要插入用户提供给您的值,请确保您使用PDO或至少mysqli_ - 否则您的网站可能容易受到攻击

注意

这很难 FAR 。我们在这里解决问题而不是为您做代码。虽然我很乐意提供帮助,但你应该尽力完成这项工作而不必为你做任何实际操作。

让我们分解您需要做的事情。

  1. 了解如何在点击事件上创建jQuery
  2. 了解如何获取所选无线电输入的值
  3. 了解如何使用JavaScript将数据发布到其他页面(ajax)
  4. 了解如何为MySQL执行INSERT查询
  5. 你可以在Stack Overflow上找到前两个。第一个&amp;最后你也可以在jQuery文档中找到。

    成为一名优秀的程序员就是解决问题和使用你的主动性。