Stop binding on load with javascript validation

I was under the impression that this was well formed, but here it forwards the href anchor (clicking "what should I call?") ​​Regardless of whether it deselects or deselects the user.

<script type="text/javascript">
function myconfirm(my_string)                                                 
{                       
 var agree = confirm('Are you sure you want to remove ' + my_string + '?');
 if(agree)                                                                       
 {                                                                               
  return true;                                                            
 }       
 else                                                                            
 {                                                                               
  return false;
 }
}                                                                                       
</script> 

      

and anchor

<a href="example.com/?remove=yes" onclick="myconfirm('my_string')">My String</a> 

      

+2


source to share


5 answers


You are not returning anything from the onclick handler. Have

onclick="return myconfirm('my_string');"

      

Alternatively, you can shorten this if clause to



return agree;

      

Or even just

return confirm('Are you sure you want to remove ' + my_string + '?');

      

+9


source


Matti is direct about the need to return something. But:

<a href="example.com/?remove=yes" onclick="myconfirm('my_string')">My String</a> 

      

Don't use the link for this. Anything that has an active effect, like a delete, should be a form with method="post"

, not a form or link that calls GET

, and the server-side script that does the delete should only accept POST requests.

Accepting GET for non-idempotent actions as well as abandoning the standard can lead to a variety of fun problems .



You can create a form submit button so that it doesn't look like a button if you really want to:

<form class="confirm" method="post" action="/remove" title="remove my string"><div>
    <input type="submit" class="unbutton" value="My String" />
</div></form>

.unbutton {
    border: none; padding: 0;
    background: transparent; color: blue;
    text-decoration: underline; cursor: pointer;
}

      

You can also avoid using the inline event handler attributes by assigning them from JS:

// Find forms with confirm class and bind to them
//
for (var i= document.forms.length; i-->0;)
    if (document.forms[i].className==='confirm')
        document.forms[i].onsubmit= getConfirmation;

// Prompt user to allow submission or not
//
function getConfirmation() {
    return confirm('Are you sure you wish to '+this.title+'?');
}

      

+2


source


Return false on onclick to stop the event.

onclick="if( !myconfirm('my_string') ) { return false; }"

      

Or simply:

onclick="return myconfirm('my_string');"

      

0


source


As onclick

you must return a value myconfirm

: onclick="return mycnfirm('my_string')"

. By the way, you can simply return the result confirm

to myconfirm

:

 function myconfirm(my_string) {
      return confirm('Are you sure you want to remove ' + my_string + '?');
 }

      

0


source


Put "javascript: void (0)" as the href and then handle everything in onclick, including changing location.href if needed.

-1


source







All Articles