dox90448 2016-08-17 15:54
浏览 48

从前一页的表单调用jquery函数

I have a search PHP page that has a search form on it as follows (I have removed the Bootstrap classes)

<form id="searchform" name="search" role="form" action="/Search" method="post">
    <input type="text" class="form-control" name="keywords" placeholder="keywords e.g. some words here"/>
    <input type="hidden" id="location" value="" class="county" name="location[]" />
    <button class="btn btn-primary btn-lg" type="submit" name="search_button" id="searchbutton">
        <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        &nbsp;&nbsp;SEARCH
    </button>
 </form>

On this search page I have the same search form on top and results are displayed in a right column and on the left are a list of check boxes and selects that called AJAX and refines the search. Findings are loaded in the div called displaylisting.

 $(document).ready(function() {
$('# list here comma separated').on('change',function(){
     $.ajax({
        type: "POST",
        url: "ajaxlistings.php",
        contentType: 'application/x-www-form-urlencoded',
        data: $("#formID").serialize(),
        cache: false,
        dataType: 'html',
        success: function(data){
            console.log(data);
            $('#displaylisting').html(data);
        },
        error: function (xhr, status, error) {
            alert("Sorry, there was a problem!: " + error);
            console.log(xhr.status);
               console.log(xhr.responseText);
               console.log(error);
        },
        complete: function (xhr, status) {
            //$('#showresults').slideDown('slow')
        }
    });
    return false;
});

/* Search button clicked */
$("#searchbutton").click(function() {
    $.ajax({
        type: "POST",
        url: "ajaxlistings.php",
        contentType: 'application/x-www-form-urlencoded',
        data: $("#formID").serialize(),
        cache: false,
        dataType: 'html',
        success: function(data){
            console.log(data);
            $('#displaylisting').html(data);
        },
        error: function (xhr, status, error) {
            alert("Sorry, there was a problem!: " + error);
            console.log(xhr.status);
               console.log(xhr.responseText);
               console.log(error);
        },
        complete: function (xhr, status) {
            //$('#showresults').slideDown('slow')
        }
    });
    return false;
});

All this is working fine when tested on the search.php page.

Here is my issue:

Logically, to get to this search page, on my index.php I also have the same search form.

What I want is that when a user clicks the search form on my index.php page they are brought to the search.php page (which it is doing at present in the action) but I want to invoke the AJAX call here to display the listings.

Is this possible? As a work around I created a hidden variable on my homepage and set to 1 and when submitted to the search PHP page it calls the same PHP code that is in the ajaxlisting.php when this value is 1. But seems counter productive especially when the ajaxlisting.php would do the job for me.

I have search the forums but cannot find an answer to my question.

  • 写回答

3条回答 默认 最新

  • doubihuai8468 2016-08-17 16:20
    关注

    To do this you could place your searched value in your keywords input and then trigger an onchange event

    HTML (please note you will need to sanitize your echo here to prevent XSS)

    <input type="text" class="form-control" name="keywords" placeholder="keywords e.g. some words here" value="<?php echo $_POST['keywords']; ?>"/>
    

    JS

    $("[name='keywords']").trigger('change');
    
    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题