如果我说不确认,如何防止更改选择框值

时间:2010-07-29 11:00:15

标签: jquery drop-down-menu

我使用国家/地区的选择框,当用户选择国家/地区时,会显示添加分支链接,并且用户在该国家/地区下添加分支机构,但是当用户想要更改国家/地区时,有关该国家/地区的所有分支机构都应该被删除。在更改国家/地区之前,会出现一个确认框并显示警告..一切正常但

如果我点击确认框中的“取消”,那么分支仍然在那里,但选择框值更改为新国家(即使我点击取消)

我需要,如果用户取消更改国家/地区,则选择框值也将是之前的国家/地区。

请告诉我如何使用JQuery 我的代码在下面给出

<form>
<table>
    <tr>
       <td >Select Country :</td>
       <td >
       <select name="country_id" id="country"  class="selectbox" title="Please select country" validate="required:true" onchange="javascript:showBranch();" >
         <option value="" >Select Country </option>
         <option value="00002" > Afghanistan</option>
         <option value="00054" > Croatia</option> 
         <option value="00060" > Dominica</option> 
         <option value="00062" > Ecuador</option> 
         <option value="00064" > El Salvador</option> 
         <option value="00067" > Estonia</option> 
         <option value="00099" > India</option> 
       </select>
       </td>
   </tr>
   <tr>
       <td>&nbsp;</td>
       <td>
        <div id="branches">
        <!-- Raw Branch Details-->
             <div><span><a title="First Branch" href="">First</a></span></div>
             <div><span><a title="Second Branch" href="">Second</a></span></div>
             <div><span><a title="Third Branch" href="">Third</a></span></div>                  
        </div>
        <div id="brancherror"></div>
       </td>
   </tr>
   <tr>
    <td>&nbsp;</td>
    <td align="left">
        <span id="branchLink" style="display:none" >
        <a href="#" class="thickbox" id="branchhref">Add Branch(es)</a></span>
    </td>
  </tr>
 </table>
 </form>

function showBranch()
    {   
        var countryid = jQuery('#country').val();
        if (jQuery("#branches>div").size())
        {
            if (confirm('If country has been changed then data corresponding to present branches will lost.Do you want to continue?'))
            {
                jQuery('#branches').html('');
            }

            jQuery('#branchhref').attr({href: "index.php?option=com_advertise&view=createbranch&format=raw&country=" + countryid + "&KeepThis=true&TB_iframe=true&height=500&width=900",title: 'Add Branch'});
        }

        else
        {
            jQuery('#branchhref').attr({href : "index.php?option=com_advertise&view=createbranch&format=raw&country=" + countryid + "&KeepThis=true&TB_iframe=true&height=500&width=900",title:'Add Branch'});
            return true;
        }
        jQuery('#branchLink').show();   
    }

4 个答案:

答案 0 :(得分:18)

您可以存储以前的值并在需要时将其设置回来,如下所示:

var countryVal;
$("#country").change(function() {
  var newVal = $(this).val();
  if (!confirm("Are you sure you wish to destroy these country branches?")) {
    $(this).val(countryVal); //set back
    return;                  //abort!
  }
  //destroy branches
  countryVal = newVal;       //store new value for next time
});

或使用.data()作为@Gaby建议,如下所示:

$("#country").change(function() {
  var newVal = $(this).val();
  if (!confirm("Are you sure you wish to destroy these country branches?")) {
    $(this).val($.data(this, 'val')); //set back
    return;                           //abort!
  }
  //destroy branches
  $.data(this, 'val', newVal);        //store new value for next time
});

答案 1 :(得分:3)

以下解决方案适合我。首先调用onfocus。此事件将当前值保存在属性“PrvSelectedValue”中。其次调用onchange,如果用户取消确认弹出,我们设置前一个值.return false用于阻止ASP.NET中的回发。

<select   
onfocus="this.setAttribute('PrvSelectedValue',this.value);" 

onchange="if(confirm('Do you want to change?')==false){ this.value=this.getAttribute('PrvSelectedValue');return false; }" 

></select>

答案 2 :(得分:0)

我发布这个回复的风险是嘲笑,因为我对这个东西很不错(只学了一两个月),但我能够处理类似的情况(改变时区)这样:

$(".timezonedropdown").change(function() {
    var newVal = $(this).val();
    if(!confirm("Are you sure?")) {
        $(this).val($(this).closest('select').attr("data-originaltimezone"));
    }
});

然后在我的html中,我在select中包含了data-originaltimezone =“whatever”。我也选择了timezonedropdown类。希望有所帮助! :)

答案 3 :(得分:0)

以下内容适用于我(Chrome)。上面没有。 如果是this.defaultValue,它将变为空,而不是默认选择的文本/值。

if(confirm('sure?')){
    //do sth;
}else{
    this.selectedIndex = 0; // if cancel the confirm window, option remains as unchanged.
}