根据网址querystring中的复选框值设置在刷新页面后选中的复选框 [英] set checkboxes checked after page refresh based on checkboxes values in the URL querystring

问题描述

我有一组复选框：

    <input name="LocType" type="checkbox" value="Hospital"/>HOSPITALS&#160;&#160;
    <input name="LocType" type="checkbox"  value="Office"/>  PHYSICIAN OFFICES&#160;&#160;
    <input name="LocType" type="checkbox"  value="Emergency"/>EMERGENCY CENTERS&#160;&#160;
    <input name="LocType" type="checkbox"  value="Out-Patient"/>OUT-PATIENT CENTERS&#160;&#160;
    <input name="LocType" type="checkbox" value="Facility"/>FACILITIES

我已经抓住他们的值，如下所示，并传递给url，页面重新加载与传递的querystring后，我想检查任何复选框的值传递，并将这些复选框设置为checked = true。

I have grabbed their values as follows and passed to the url, after page reloads with the passed querystring, i wanna check for whatever checkboxes values were passed and set those checkboxes to checked=true.

var url = "http://mysite.com/contact-us/Pages/LocationSearch.aspx?s=bcs_locations&k=";     
var checkboxValues = $("input[name=LocType]:checked").map(function() {
    return ' '+'bcslocationtype:'+"\"" + $(this).val() + "\"";}).get().join(" OR ");                 

         window.location= url +  checkboxValues;

当选中医院和紧急情况复选框并点击搜索时，网址如下所示：
< a href =http://mysite.com/contact-us/Pages/LocationSearch.aspx?s=bcs_locations&k= =nofollow> http://mysite.com/contact-us/Pages/LocationSearch .aspx？s = bcs_locations& k = bcslocationtype：医院或bcslocationtype：紧急

When Hospitals and Emergency checkboxes are checked and hit search, URL looks like this: http://mysite.com/contact-us/Pages/LocationSearch.aspx?s=bcs_locations&k= bcslocationtype:"Hospital" OR bcslocationtype:"Emergency"

现在为什么事情不工作，看到任何错误的这个？它的insde document.ready（）{}

Now why is thing not working, I don't see anything wrong with this?its insde document.ready(){}

//Keep the selected chkboxes checked on page redirect
    var value = window.location.href.match(/[?&]k=([^&#]+)/) || [];
    if (value.length == 2) {
        $('input[name=LocType]').each(function (index) {
            if(value[1].indexOf($(this).val())>=0)
                this.prop("checked", true); 
            }); 
    }  

推荐答案

 $(document).ready(function(){

   var value = window.location.href.match(/[?&]k=([^&#]+)/) || [];
   var actualValue = value[1].split(":")
    console.log(actualValue[1]);
    $('input[name=LocType]').each(function (index) {
            if(actualValue[1] === $(this).val()){
            //or use if(actualValue[1].indexOf($(this).val())>=0){
                $(this).prop("checked", true); 
            }

    }); 
});

还要注意，为了访问像'prop'这样的jquery相关方法，这'在'$'。所以我把你的代码从'this'更新为'$（this）'。此外，我们的目的是使用bcslocationtype：医院'作为价值。为什么你需要'bcslocationtype'作为变量k的值。你不能只是追加k =医院等？

Also note that, in order to access jquery related methods like 'prop', you need to wrap 'this' in '$'. So I updated your code from 'this' to '$(this)'. Also, what us the purpose of using 'bcslocationtype:"Hospital" ' as value. Why do you require 'bcslocationtype' as a value for variable k. Can't you just append k=hospital etc?

此外，你可以做同样的事情使用aspx。我不知道aspx代码，但在Coldfusion我会做如下：假设'k'是url变量名称

Also, you can do the same thing using aspx. I am not sure about the aspx code, but in Coldfusion I would do something like below: Assuming 'k' is the url variable name

 <input name="LocType" type="checkbox" value="Hospital" <cfif isDefined("URL.k") and URL.k eq "HOSPITAL">CHECKED</cfif> />HOSPITALS&#160;&#160;

要输入的输入标记内的代码为< cfif isDefined（URL .k）和URL.k eqHOSPITAL> CHECKED< / cfif> 。这意味着，如果我有一个名为'k'的变量定义和设置在URL范围，如果值是医院，请选中。将它转换为您的asp代码。

The code within input tag to peruse is <cfif isDefined("URL.k") and URL.k eq "HOSPITAL">CHECKED</cfif>. It means, if I have a variable called 'k' defined and set in URL scope, and if the value is hospital, make it checked. Convert it into your asp code.

这篇关于根据网址querystring中的复选框值设置在刷新页面后选中的复选框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！