Question

在我当前项目的页面加载中，我出现了一个模态叠加层，提示用户输入一个5位长的值。从该值开始，我希望对API进行AJAX调用以查看该值是否存在/匹配并从那里更新导航栏以说“Hello，[user]”（[user]是另一个键值对来自5位长值引用的JSON对象。我还是AJAX的新手，所以我想知道最好的方法是做什么。我知道以下是完全错误的，但我想这是基本的开始这样的事情的框架。

;WITH cte AS (
SELECT 
  patient_id
  ,attending_id
  ,proc_duration
  ,proc_chron
  ,proc_chron_end
FROM patient_clin_tran
WHERE place_of_service NOT IN ('23', '24', '25', '26')
  AND proc_chron BETWEEN '2015-06-01' AND '2015-09-01'
  AND billing_proc_code NOT IN ('BHHMTH'))
SELECT c1.*
FROM cte c1
  INNER JOIN cte c2 ON c1.patient_id = c2.patient_id
WHERE c2.proc_chron BETWEEN c1.proc_chron AND c1.proc_chron_end
  AND c2.proc_chron_end BETWEEN c1.proc_chron AND c1.proc_chron_end
  AND c1.attending_id != c2.attending_id

Answer 1

$("#inputForm").submit(function(evt){
    $.ajax({
        url: "/my/api/url/",
        type: "POST",
        data: postData
        success: function(returnData){
          var data = JSON.parse(returnData);
          // check data and update nav bar
        }
        error: function() {
          evt.preventDefault();
          // show error
        }
    });
});

Answer 2

尝试使用change事件prompt

＆＃13;

$(function() {
  var check = function(vals, data) {
    if (vals.length === 5 && vals.split("").every(Number)) {
      if (vals in data) {
        // do `$.ajax()` stuff here
        /*
        $.ajax({
          url: "/my/api/url/",
          type: "POST",
          data: vals
          success: function(returnData) {
            var data = JSON.parse(returnData);
            // check data and update nav bar
            $("#navbar").html("Hi, " + data)
          }
          error: function() {
            evt.preventDefault();
            // show error
          }
        });
        */
        $("#navbar").html("Hi, " + data[vals])
      }
    }
  };
  var data = {
    12345: "abc"
  };
  var vals = prompt("enter 5 digits");
  if (vals !== null) check(vals, data);
  $("input").change(function(e) {
    check(this.value, data)
  })
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="navbar"></div>
<input type="text" placeholder="enter 12345" />

＆＃13;

通过ajax将用户输入值与JSON对象进行比较，最终更新页面内容

2 个答案: