我想用 PHP 和 jQuery 做以下事情
https://www.careerbuilder.com/share/register.aspx?sc_cmp1=JS_LoginASPX_RegNow
步骤
然后我需要验证所选的城市、州和国家/地区。
你有什么想法吗？
提前致谢
【问题讨论】：
标签： php jquery validation geocode
不退出您的要求，但是这会自动填充用户数据并保存在浏览器中的字段。
使用 HTML 自动完成： https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
<form method="post">
<input type="text" name="userCountry" id="country-name" autocomplete="on" />
<input type="submit" />
</form>
然后使用PHP验证信息；
<?PHP
/* SANITIZE END-USER INPUTs */
if ( $_SERVER["REQUEST_METHOD"] == "POST" ) {
$_POST = filter_var_array( $_POST, FILTER_SANITIZE_STRING );
}
/* VALIDATE DATA */
if ( isset( $_POST['userCountry'] ) {
$countrys = array( "united states of america", "united kingdom", "australia" );
if ( !in_array( strtolower( $_POST['userCountry'] ), $countrys ) ) {
/* Return a failed response */
return false;
}
}
/* SAVE DATA */
/* Return a successful response */
return true;
?>
或
您可能需要查看 onChange 然后填充数据。例如。
$("#country-name").change(function () {
$("#state, #city").find("option:gt(0)").remove();
$("#state").find("option:first").text("Loading...");
$.getJSON("/get/states", {
country_id: $(this).val()
}, function (json) {
$("#state").find("option:first").text("");
for (var i = 0; i < json.length; i++) {
$("<option/>").attr("value", json[i].id).text(json[i].name).appendTo($("#state"));
}
});
});
$("#state").change(function () {
$("#city").find("option:gt(0)").remove();
$("#city").find("option:first").text("Loading...");
$.getJSON("/get/cities", {
state_id: $(this).val()
}, function (json) {
$("#city").find("option:first").text("");
for (var i = 0; i < json.length; i++) {
$("<option/>").attr("value", json[i].id).text(json[i].name).appendTo($("#city"));
}
});
});
【讨论】：
var app = angular.module('ganesh', []);
app.controller('MainCtrl', function($scope) {
$scope.name = "Charlie's Programming..........";
$scope.countries = {
'USA': {
'Alabama': ['Montgomery', 'Birmingham'],
'California': ['Sacramento', 'Fremont'],
'Illinois': ['Springfield', 'Chicago']
},
'India': {
'AndamanandNicobarIslands' : { },
'AndhraPradesh' : { },
'ArunachalPradesh' : { },
'Assam' : { },
'Bihar' : { },
'Chandigarh' : { },
'Chhattisgarh' : { },
'DadraandNagarHaveli' : { },
'DamanandDiu' : { },
'Delhi' : { },
'Goa' : { },
'Gujarat' : { },
'Haryana' : { },
'HimachalPradesh' : { },
'JammuandKashmir' : { },
'Jharkhand' : { },
'Karnataka' : { },
'Kerala' : { },
'Lakshadweep' : { },
'MadhyaPradesh' : { },
'Maharashtra' : {
'Ahmednagar' : [ ],
'Akola|Alibag' : [ ],
'Amaravati' : [ ],
'Arnala' : [ ],
'Aurangabad' : [ ],
'Aurangabad' : [ ],
'Bandra' : [ ],
'Bassain' : [ ],
'Belapur' : [ ],
'Bhiwandi' : [ ],
'Bhusaval' : [ ],
'Borliai-Mandla' : [ ],
'Chandrapur' : [ ],
'Dahanu' : [ ],
'Daulatabad' : [ ],
'Dighi(Pune)' : [ ],
'Dombivali' : [ ],
'Goa' : [ ],
'Jaitapur' : [ ],
'Jalgaon' : [ ],
'JawaharlalNehru(NhavaSheva)' : [ ],
'Kalyan' : [ ],
'Karanja' : [ ],
'Kelwa' : [ ],
'Khopoli' : [ ],
'Kolhapur' : [ ],
'Lonavale' : [ ],
'Malegaon' : [ ],
'Malwan' : [ ],
'Manori' : [ ],
'MiraBhayandar' : [ ],
'Miraj' : [ ],
'Mumbai(exBombay)' : [ ],
'Murad' : [ ],
'Nagapur' : [ ],
'Nagpur' : [ ],
'Nalasopara' : [ ],
'Nanded' : [ ],
'Nandgaon' : [ ],
'Nashik' : ['422606', '422004', '422002', '422003'],
'NaviMumbai' : [ ],
'Nhave' : [ ],
'Osmanabad' : [ ],
'Palghar' : [ ],
'Panvel' : [ ],
'Pimpri' : [ ],
'Pune' : [ ],
'Ratnagiri' : [ ],
'Sholapur' : [ ],
'Shrirampur' : [ ],
'Shriwardhan' : [ ],
'Tarapur' : [ ],
'Thana' : [ ],
'Thane' : [ ],
'Trombay' : [ ],
'Varsova' : [ ],
'Vengurla' : [ ],
'Virar' : [ ],
'Wada' : [ ],
'Panvel' : [ ],
'Pimpri' : [ ],
'Pune' : [ ],
'Ratnagiri' : [ ],
'Sholapur' : [ ],
'Shrirampur' : [ ],
'Shriwardhan' : [ ],
'Tarapur' : [ ],
'Thana' : [ ],
'Thane' : [ ],
'Trombay' : [ ],
'Varsova' : [ ],
'Vengurla' : [ ],
'Virar' : [ ],
'Wada' : [ ],
},
'Manipur' : { },
'Meghalaya' : { },
'Mizoram' : { },
'Nagaland' : { },
'Orissa' : { },
'Pondicherry' : { },
'Punjab' : { },
'Rajasthan' : { },
'Sikkim' : { },
'TamilNadu' : { },
'Telangana' : { },
'Tripura' : { },
'Uttaranchal' : { },
'UttarPradesh' : { },
'WestBengal' : { }
},
'Australia': {
'New South Wales': ['Sydney'],
'Victoria': ['Melbourne']
}
};
$scope.GetSelectedCountry = function () {
$scope.strCountry = document.getElementById("country").value;
};
$scope.GetSelectedState = function () {
$scope.strState = document.getElementById("state").value;
};
$scope.GetSelectedcity = function () {
$scope.strCity = document.getElementById("city").value;
};
$scope.GetSelectedpin = function () {
$scope.strPin = document.getElementById("pin").value;
};
}); <!DOCTYPE html>
<html ng-app="ganesh">
<head>
<meta charset="utf-8" />
<title>Charlie</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
</head>
<body >
<div ng-controller="MainCtrl">
<p>Welcome to {{name}}</p>
<label for="country">Country *</label>
<select id="country" ng-model="statessource" ng-options="country for (country, states) in countries"
ng-change="GetSelectedCountry()">
<option value=''>Select</option>
</select>
<label for="state">State *</label>
<select id="state" ng-disabled="!statessource" ng-model="model.state" ng-options="state for (state,city) in statessource"
ng-change="GetSelectedState()"><option value=''>Select</option>
</select>
<label for="city">City *</label>
<select id="city" ng-disabled="!model.state" ng-model="model.city" ng-options="city for (city, pin) in model.state"
><option value=''>Select</option>
</select>
<label for="pin">Pincode *</label>
<select id="pin" ng-disabled="!model.city" ng-model="model.pin" ng-options="pin for pin in model.city"
><option value=''>Select</option>
</select>
</div>
</body>
</html>【讨论】：
打印带有状态列表的下拉列表 通过方法使状态的列表 id 获取或发布 id， 制作一个 sql 城市列表表并使用 php 调用该表比 jquery 需要更多时间，但它可以工作
【讨论】：
从下拉列表中选择一个国家。
我假设这是一个从数据库表中填充的 HTML SELECT。
城市下拉列表将填满 自动与城市列表 所选国家/地区。
不要这样做。你想要的是一个 jQuery Autocomplete，用户开始输入，然后你从数据库中提取可能的条目。
如果状态是 可用于该国家然后说明 列表将在所有状态下可见 该国家/地区的列表。
如果您要进行邮寄地址验证，则仅在少数国家/地区需要此功能。一种常见的处理方法是隐藏SELECT 框，当用户选择一个国家（例如澳大利亚）时，您需要在其中显示省份。
那我需要 验证选定的城市、州和 国家。
请注意，State/Province 和 Country 是 SELECT 控件，因此它们永远不会产生无效结果，并且无法验证城市名称。
【讨论】：
我们所做的是使用 ServiceObjects.com 来验证地址。
所以我们让用户在纯文本字段（或多或少）中输入他们的地址，然后简单地将地址详细信息发送到 ServiceObjects.com 并使用他们的 web 服务返回的规范化/更正后的地址。
这不是直接回答您的问题，但也许它为根本问题提供了另一种解决方案。
【讨论】：
这是一个非常标准的 AJAX 场景。事实上，您描述的确切问题可能是最常见的 Ajax 介绍性示例。您已将 PHP 和 jQuery 列为问题的标签；将这些结合使用将使解决方案变得非常简单。
我的建议是使用 PHP 查找 jQuery Ajax 示例。您几乎肯定会找到您正在寻找的东西。
【讨论】：
我也面临着类似的挑战。我不知道您是否是这种情况，但就我而言，我们需要确保输入的城市确实是现有城市。稍后在项目中，我们希望能够收集世界任何地方的同一城市的条目。这些结果需要精确。 所以我们不能让人们也进入费城和费城。我们还希望人们使用城市的英文名称而不是他们自己语言的名称。
我找到了一些国家、州和城市的公共数据库。例如这里：MaxMind。但这是一个大约 300 万个城市的列表，我发现另一个超过 600 万个城市。我已经按照您描述的方式进行了设置。选择国家，然后通过 AJAX 调用获取其中的城市并填写下拉列表。对于像荷兰这样的国家来说，这大约需要 2 秒，但对于中国或俄罗斯来说，加载是不可接受的。 而且列表很大，而且对用户来说根本不友好。
所以我认为最好让人们在文本字段中输入它们，因为城市真的全部匹配并不是那么重要。 我们现在正在研究 Google Maps API 来解决我们的问题。
【讨论】：
如果您想让外国人更容易输入地址，那么请简单地提供一个文本字段，地址可以作为格式化文本输入。很少有国家使用州（或类似的东西）作为地址的一部分，我不明白您为什么要提供带有城市的下拉列表。德国城市列表（或更正确、有效的邮政地址中的地名）将包含大约 23,000 个条目。你觉得哪个更容易，输入地址或尝试在这样的列表中找到地名_
【讨论】：