将值设置为输入,而不是单击div以提交表单

时间:2014-08-22 23:31:33

标签: php jquery post click submit

我是php java脚本和html的新手很抱歉,如果这看起来很草率。但是我一直在线阅读并设法将sql db中的实时搜索功能整合在一起。它使用溢出来填充div标签以滚动搜索结果,搜索结果是单独的div标签。我希望能够点击div提交表单并将$ rmaNumber的变量带到$ _POST,以便我可以使用它。

这是实时搜索功能。当我点击div时,它将rmaNumber放入rmaSearch输入标签,这很棒,但我在想是否使用了onclick =" document.rmaSearchForm.submit()"在div标签上,它会将其传递给表单动作。

$(function(){
        $(".search").keyup(function(){
            var rmaSearch = $(this).val();
            var dataString ='search='+ rmaSearch;
            if(rmaSearch!=''){
                $.ajax({
                    type: "POST",
                    url: "searchResults.php",
                    data: dataString,
                    cache: false,
                    success:function(html){
                        $("#result").html(html).show();
                    }
                });
            }return false;
        });

        $(".show").live("click", function(e){
            var $clicked = $(e.target);
            var $name = $clicked.find('.name').html();
            var decoded = $("<div/>").html($name).text();
            $('#rmaSearch').val(decoded);

        });

        $(document).live("click", function(e){
            var $clicked = $(e.target);
            if(! $clicked.hasClass("search")){
                jQuery("#result").fadeOut();
            }
        });
        $('#rmaSearch').click(function(){
            $("#result").fadeIn();
        });


    });


    </script>

这是我的HTML。它位于上面的jquery脚本之下。

<body>
    <form id="rmaSearchForm" name="rmaSearchForm" method="post" action="viewResultsForm.php">
        <div class="searchDiv">
        <p>&nbsp; &nbsp; RMA Search<br /></p>

        <input type="text" class="search" id="rmaSearch" name="rmaSearch" placeholder="Enter RMA Number" autocomplete="off" />

        <div id="result"></div>
        </div>
    </form>
</body>

这是在jquery脚本中找到的动态搜索searchResults.php。

if(strlen($_POST['search'])>=1){
$q = mysqli_real_escape_string($con, $_POST['search']);


$sqlResults=mysqli_query($con, "SELECT * FROM customer WHERE rmaNumber LIKE '%$q%' ORDER BY rmaNumber");
while($row=mysqli_fetch_array($sqlResults)){

    $rmaNumber=$row['rmaNumber'];

    $b_rmaNumber='<strong>'.$q.'</strong>';

    $f_rmaNumber=str_ireplace($q, $b_rmaNumber, $rmaNumber);

    ?>
    <div onclick="document.rmaSearchForm.submit()" class="show" align="left">
        RMA# <span class="name"><?php echo $f_rmaNumber; ?></span><br />
    </div>
    <?php

}

如果有人有更好的方法,我很乐意接受建议。就像我说我刚开始学习PHP,jquery,html / css和mysql在过去的6个月里所以我知道我的代码不是应该的那么好但是我还在学习。如果需要更多信息,请多询问是否愿意告诉我更多信息。

1 个答案:

答案 0 :(得分:0)

这样做:

$("#rmaSearchForm").on("click", ".show", function() {
    var name = $(this).find(".name").text();
    $("#rmaSearch").val(name);
    $("#rmaSearchForm").submit();
});
带有选择器参数的

.on()将事件委托执行到动态添加的元素,例如.live()。无需调用.html(),然后从中创建新的jQuery对象,然后调用.text() - 您可以直接在DOM元素上调用.text()。然后只需更新输入字段并提交表单。

您可能还想查看使用jQuery UI Autocomplete,因为这似乎基本上就是您在此处实施的内容。