试图在一个页面上运行两个自动完成查询，两个不能一起工作

我试图在两个输入框中查询一个页面上运行两个自动完成jQuery查询。在那里他们工作得很好，但在一起，都没有工作。试图在一个页面上运行两个自动完成查询，两个不能一起工作

<html> 
<head> 
    <title>WWW</title> 
    <link href="css/page.css" rel="stylesheet" type="text/css" /> 
    <link href="css/div-forms.css" rel="stylesheet" type="text/css" /> 
    <link href="css/jquery-ui.css" rel="stylesheet" type="text/css" /> 
    <script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
    $(document).ready(function() { 
     src = 'actions/auto-complete-makes.asp'; 
     $("#id-make").autocomplete({ 
     source: function(request, response) { 
      $.ajax({ 
      url: src, 
      dataType: "json", 
      data: { 
       term: request.term, 
      }, 
      success: function(data) { 
       response(data); 
      } 
      }); 
     }, 
     min_length: 2, 
     }); 
    }); 

    $(document).ready(function() { 
     src = 'actions/auto-complete-models.asp'; 
     $("#id-model").autocomplete({ 
     source: function(request, response) { 
      $.ajax({ 
      url: src, 
      dataType: "json", 
      data: { 
       term: request.term, 
       make: $('#id-make').val() 
      }, 
      success: function(data) { 
       response(data); 
      } 
      }); 
     }, 
     min_length: 2, 
     }); 
    }); 
    </script> 
</head> 

<body> 
    <div class="div-form-title"> 
    <span class="page-title"><b>New I.T. Asset Form</b></span> 
    </div> 
    <form action="actions/add-it-asset-to-db.asp" name="frmITasset" id="id-frmNewAsset" method="post" onSubmit="return validateNewAsset();"> 
    <tr> 
     <span class="field-name top required">Make</span><br /> 
     <input type="text" class="form-box-wide" id="id-make" name="frm-make" maxlength="30" autocomplete="off" /><br /> 
     <span class="field-name required">Model</span><br /> 
     <input type="text" class="form-box-wide" id="id-model" name="frm-model" maxlength="30" autocomplete="off" /><br /> 
     <input type="submit" value="Add Asset" id="id-form-submit" class="form-bttnStandard" /> 
    </tr> 
    </form> 
    </div> 
</body> 
</html>

当他们都在一起时，只有＃id模型的作品，但它自己，＃id-make工作正常。

任何指针请，因为我不明白什么是错的。

来源

2017-08-10 John Moore

您可以检查控制台是否有任何错误，并在此提及吗？ – Kashyap

两个独立的'document.ready'处理程序可以以任意顺序执行，并且全局作用域的'src'变量需要同时保存两个不同的值？至少你应该把这些处理程序结合起来，只在你使用它的地方硬编码“src”的值。 – David

谢谢大卫，但我该怎么做。对此很新颖。干杯 –

一个“准备好”的包装是足够的...这不是问题。
但是两个值需要两个“src”变量。

由于自动完成发生在用户键入...
需要两个URL。你不能使用相同的变量。

$(document).ready(function() { 
    src1 = 'actions/auto-complete-makes.asp'; 

    $("#id-make").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
     url: src1, 
     dataType: "json", 
     data: { 
      term: request.term, 
     }, 
     success: function(data) { 
      response(data); 
     } 
     }); 
    }, 
    min_length: 2, 
    }); 

    src2 = 'actions/auto-complete-models.asp'; 

    $("#id-model").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
     url: src2, 
     dataType: "json", 
     data: { 
      term: request.term, 
      make: $('#id-make').val() 
     }, 
     success: function(data) { 
      response(data); 
     } 
     }); 
    }, 
    min_length: 2, 
    }); 
}); // ready

来源

2017-08-10 12:33:59

试图在一个页面上运行两个自动完成查询，两个不能一起工作

回答

相关问题