Question

form_page.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="js/process_truck_req.js"></script>
    <script src="js/jquery-1.2.3.pack.js"></script>
    <script src="js/runonload.js"></script>
</head>

<div class="prform" id ="request_form">    
    <form name="truckreq" action="" method="post" class="truckreq_form">
        <label for="seltruck" id="seltruck_label"><font class="whitetext">Select Truck</font></label><br />
        <select name="seltruck" id="seltruck">
            <option value="Select a Truck"> Select a Truck</option>
            <option value="2011+Tacoma">2011 Tacoma</option>
            <option value="2008+Tundra">2008 Tundra</option>
            <option value="2000+Tacoma">2000 Tacoma</option>
        </select><br />
        <label class="error" for="seltruck" id="seltruck_error"><font class="redtext">This field is required.</font></label><br />
        <label class="error" for="seltruck" id="seltruck_noavail_error"><font class="redtext">Not Available on selected Dates.</font></label><br />
    </form>

process_request.js

$(function() {
    $('.error').hide();
    $('input.text-input').css({backgroundColor:"#FFFFFF"});
    $('input.text-input').focus(function(){
    $(this).css({backgroundColor:"#FFDDAA"});
});

$('input.radio-input').focus(function(){
    $(this).css({backgroundColor:"#FFDDAA"});
});

$('input.text-input').blur(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
});

$(".button").click(function() {
    // validate and process form
    // first hide any error messages
    $('.error').hide();

    var seltruck = $("#seltruck").val();
    if (seltruck == "Select a Truck") {
        $("label#seltruck_error").show();
        $("#seltruck").focus();
            return false;
        }

        var truckSearch = 'seltruck=' + seltruck + '&outdate=' + outdate + '&indate=' + indate;

        $.ajax({
            type: "POST",
            url: "do_truck_search.php",
            data: truckSearch,
            success: function() {
                var truck_status = $("#truck_status").val();
                if (truck_status == "nopass") {
                    $("label#seltruck_noavail_error").show();
                    $("#seltruck").focus();
                    return false;
                }
            }
        });
    });
});

runOnLoad(function() {
    $("input#projdesc").select().focus();
});

从form_page.html获取输入表单数据，传递给process_request.js进行验证。我只显示了seltruck，其他表单字段在form_page.html中设置。

在.js验证时，会检查字段是否填写，否则，错误标签类会显示在form_page.html上。

seltruck表单字段需要查询mysql并检查其可用性。我有do_truck_search.php脚本运行良好，但不知道如何将do_truck_search.php中的'truck_status'变量传递回.ajax调用。

回到.ajax调用后，我想成功：'继续'或错误：显示标签＃seltruck_noavail_error。

任何帮助？

谢谢！

更新 - 无法让这个工作？ dataType：.ajax中的“text”有效吗？有什么想法吗？

do_truck_search.php

if (($unixoutdate >= $dbunixoutdate) && ($unixoutdate <= $dbunixindate) && ($dbtruck == $seltruck_final)){
    $truck_status = "nopass";
    $data2 = array('truck_status' => $truck_status);
    echo json_encode($data2);
}

process_request.js：

$.ajax({
  type: "POST",
  url: "do_truck_search.php",
  data: truckString,
  dataType: "json",
  success: function(data) {
      if (data.truck_status == "nopass"){
          $("label#seltruck_noavail_error").show();
      }
    }
});

更新

我认为json数据类型不可靠的原因是因为PHP脚本中回显了一个小方块（可能是空格）。使用数据类型：.ajax成功回调中的'text'和alert（）显示实际数据文本之前的小方块。我的脏解决方案是使用数据类型：text，然后只是我想要检索的实际数据。

我在PHP脚本中搜索hi / low以查找echo'd空间的原因，但找不到它？

Answer 1

一种可能的方法：

在$.ajax设置dataType: "json"
在PHP脚本echo json_encode(array("truck_status" => $truck_status));中。请注意，不得存在其他输出（因此请禁用布局，视图等。）
将success: function() {...}更改为success: function(data, status) {...};现在，变量data将包含键truck_status以及您设置的任何内容。因此，请使用data.truck_status。

ajax - 访问url中设置的变量：

1 个答案: