javascript - Data dismiss in modal being called twice on click -

-

i've been working modal gets dismissed when user clicks 'cancel' button. working fine until button developed bug. when click on 'cancel' button, modal dismissed, closes , opens again. 1 needs click dismiss button twice close modal.

this 'bootstrap' modal , haven't made changes js file. css , html have been tinkered with. on inspecting in browser, see following function being called twice.

<div class="modal-backdrop fade in"></div>

how fix error? have no idea start! following modal code.

note: same error being encountered 'cross' aria label @ top-right corner of modal.

<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mysmallmodallabel" aria-hidden="true">                          <div class="modal-dialog modal-sm">                            <div class="modal-content">                               <div class="modal-header">                               <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">&times;</span></button>                               <h4 class="modal-title" id="mymodallabel"><b>why deleting book?</b></h4>                             </div>                                <!--modal body starts -->                               <div class="modal-body">                                  <div class="radio">                                   <label>                                       <input type="radio" name="optionsradios" id="optionsradios1" value="option1" checked>sold                                 </div>                                  <div class="radio">                                   <label>                                     <input type="radio" name="optionsradios" id="optionsradios2" value="option2">sold on site or elsewhere                                   </label>                                 </div>                                  <div class="radio">                                   <label>                                     <input type="radio" name="optionsradios" id="optionsradios2" value="option2">don't want sell                                   </label>                                 </div>                                  <div class="radio">                                   <label>                                     <input type="radio" name="optionsradios" id="optionsradios2" value="option2">lack of buyer interest                                   </label>                                 </div>                                  <div class="radio">                                   <label>                                     <input type="radio" name="optionsradios" id="optionsradios2" value="option2">vacation, break                                   </label>                                 </div>                                  <div class="radio">                                   <label>                                     <input type="radio" name="optionsradios" id="optionsradios2" value="option2">other reason                                   </label>                                 </div>                                </div>                               <!--modal body end -->                                <div class="modal-footer">                                 <button type="button" class="btn btn-primary">delete</button>                                 <button type="button" class="btn btn-default" data-dismiss="modal">cancel</button>                               </div>                            </div>                         </div>                       </div>

html code button opens modal

<button type= "submit" class="dashbtn dashbtn-danger">edit</button><br> <button type= "button" class="dashbtn dashbtn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">delete</button>

this happens when have more 1 modal in code share same class. prevent these type of situations, assign different ids modals , use id in data-target attribute. try this:

<button type="submit" class="dashbtn dashbtn-danger">edit</button> <br> <button type="button" class="dashbtn dashbtn-primary" data-toggle="modal" data-target="#bs-example-modal-sm">delete</button>

and modal:

<div class="modal fade" id="bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mysmallmodallabel" aria-hidden="true">     <div class="modal-dialog modal-sm">         <div class="modal-content">             <div class="modal-header">                 <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">&times;</span>                 </button>                 <h4 class="modal-title" id="mymodallabel"><b>why deleting book?</b></h4>             </div>             <!--modal body starts -->             <div class="modal-body">                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios1" value="option1" checked>sold                 </div>                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios2" value="option2">sold on site or elsewhere                     </label>                 </div>                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios2" value="option2">don't want sell                     </label>                 </div>                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios2" value="option2">lack of buyer interest                     </label>                 </div>                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios2" value="option2">vacation, break                     </label>                 </div>                 <div class="radio">                     <label>                         <input type="radio" name="optionsradios" id="optionsradios2" value="option2">other reason                     </label>                 </div>             </div>             <!--modal body end -->             <div class="modal-footer">                 <button type="button" class="btn btn-primary">delete</button>                 <button type="button" class="btn btn-default" data-dismiss="modal">cancel</button>             </div>         </div>     </div> </div>

just make sure assign different ids each modal , trigger each 1 using data-target="#foo"

look section on modal data attributes: bootstrap modals


Comments

Post a Comment

Popular posts from this blog

node.js - Mongoose: Cast to ObjectId failed for value on newly created object after setting the value -

-
this question has answer here: what's mongoose error cast objectid failed value xxx @ path “_id”? 7 answers even though has been asked many times because entity has no valid objectid field. i came across situation objectid set value can casted objectid still error. the schema: var serviceschema = parammongoose.schema({ servicename:{ type: parammongoose.schema.types.objectid , ref: 'servicenames',required:true } }); pseudo code: servicefromdb=new service({servicename:'some name'}); servicefromdb.servicename='000000000000000000000001'; servicefromdb.save(function(paramerror,paramdata){ if(paramerror){ console.log('but but...',servicefromdb,paramerror) } }); the output of code is: but but... { servicename: 000000000000000000000001, _id: 55079a90286f49280364f78b } { [casterror: cast objectid faile...
Read more

gradle error "Cannot convert the provided notation to a File or URI" -

-
i have defined 2 system properties in gradle.properties: systemprop.builddir=build systemprop.cfgdir=build\\cfg and have following task defined in build.gradle: task clean(group:'clean',description:'clean project') << { ant.sequential { delete(dir: system.properties.builddir) mkdir(dir: system.properties.builddir) delete(dir: system.properties.cfgdir) mkdir(dir: system.properties.cfgdir) } } this generates following error: execution failed task ':clean'. > cannot convert provided notation file or uri: {dir=build}. following types/formats supported: - string or charsequence path, e.g 'src/main/java' or '/usr/include' - string or charsequence uri, e.g 'file:/usr/include' - file instance. - uri or url instance. but equivalent block of code not generate error , works expected: task clean(group:'clean',description:'clean project') << { ...
Read more

python - NameError: name 'subprocess' is not defined -

-
i'm trying make rng website: http://jamesdotcom.com/?p=417 . when run following code: captureimage = subprocess.popen( [ "fswebcam", "-r", "356x292", "-d", "/dev/video0", "static.jpg", "--skip", "10" ], stdout=devnull, stderr=devnull) captureimage.communicate() i following error message: nameerror: name 'subprocess' not defined what should do? thanks have imported first? import subprocess captureimage = subprocess.popen(["fswebcam", ...) subprocess included in python standard library since python 2.4. should not necessary install it.
Read more