如果我说不要确认，如何防止更改选择框值 [英] how to prevent to change selectbox value if i say no to confirm

问题描述

我使用一个国家的选择框，当用户选择一个国家，然后添加分支链接出现，用户在该国家添加分支，但是当用户想要更改国家，那么该国家的所有分支应该被破坏。在更改国家之前，确认框出现并显示警告。如果我在确认框上单击取消，则分支仍然存在但是选择框值，但是如果一切正常，但是

i m using a select box of country, when user select a country then add branch link appears and user add branches under that country, but when user want to change country then all branches regarding that country should be destryoed. before changing a country a confirm box appears and show warning..everything is working fine but

更改为新的国家（即使我点击取消）

if i click 'Cancel' on confirm box then branches remains there but select box value changed to new country (even i click on cancel)

我需要，如果用户取消更改国家，那么选择框值也将是以前的国家。

i need that if user cancel to change country then select box value also would be previous country.

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

please tell how to do it with JQuery my code is given below

<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();   
    }

推荐答案

如果需要，将其设置回来，如下所示：

You can just store the previous value and set it back if needed, like this:

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（） a href =https://stackoverflow.com/users/128165/gaby> @Gaby 建议，如下所示：

Or use .data() as @Gaby suggests, like this:

$("#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
});

这篇关于如果我说不要确认，如何防止更改选择框值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！