How can i prevent a submit button if succes data

Question

I have a form, My JS code is below the HTML Form.

If the url doesn't exist if want to show an alert (like the file exist) and prevent the validation of the submit (so refresh page) .

I may use return true or false ? If it's the case where have i to put them ?

echo '<form id="gestion_form" method="post" action="#" enctype="multipart/form-data">'; 
....
echo '<button class="btn btn-green" style="margin-left: 10px; margin-bottom: 15px;" type="submit" name="Envoyer" id="envoyer">MODIFIER !</button>'; 
echo '</form>';

<script type="text/javascript">
$(function() {
$("#envoyer").click(function() {
$("#loader").show();
var file = $("#vignette").val();
var address = window.location.protocol + '//' + window.location.hostname;
$.ajax({
  url: address + "/admin/img/" + file,
  success: function(data){
    alert("the file exist");
    // Return false here or true ?
  },
  error: function(data){
   // Return false here or true ?
  }
});

});
});
</script>

score 1 · Accepted Answer · answered Feb 07 '14 at 23:17

$.ajax is, by default, an asynchronous request. Set async: false and the function wont return until the call completes. See http://api.jquery.com/jquery.ajax/ for more details.

<script type="text/javascript">
$(function() {
    $("#envoyer").click(function() {
        $("#loader").show();
        var file = $("#vignette").val();
        var address = window.location.protocol + '//' + window.location.hostname;
        $.ajax({
              url: address + "/admin/img/" + file,
              async: false,
              success: function(data){
                    alert("the file exist");
                    return true;
              },
              error: function(data){
                   alert("something went wrong");
                    return false;
              }
        });

    });
});
</script>

score 0 · Answer 2 · edited May 23 '17 at 10:25

0

You can't really validate whether a url exists using javascript and it's not entirely easy to do with server-side code.

If you're looking for a way to validate the format of the URL: https://stackoverflow.com/a/17726973/143269

edited May 23 '17 at 10:25

Community

1
1

answered Feb 07 '14 at 22:57

helion3

34,737
15
57
100

score 0 · Answer 3 · answered Feb 07 '14 at 23:08

You could do another ajax first, before submitting, just to see if there is a response. Here some php snippets

function is_host($sCheckHost = 'www.google.com'){ //replace google with your domain
    return (bool) @fsockopen($sCheckHost, 80, $iErrno, $sErrStr, 5);
}

or

function is_file($file){ //crossdomain file
    $file_headers = @get_headers($file);
    if(strpos($file_headers[0], '404') || (strpos($file_headers[0], '302') && strpos($file_headers[7], '404'))) return false;
    else return true;
}

and return this to the new ajax function, this could do the trick, good luck.

Oh, it seems I misunderstood your question. If the address doesn't exists, the ajax world return an error anyway, what is the question now ? I mean, it cannot return a true or false, it just return error :-) — ddlab, Feb 07 '14 at 23:15

score 0 · Answer 4 · answered Feb 07 '14 at 23:19

I've resolved it.

I just wanted to add return false or true, but i didn't know where. This is my code, it works, i can check if the adress exist and if it's the case i put an alert and the user stay in the page without any reloading.

$(function() {

$("form[name=otsconfig]").submit(function() {
$("#loader").show();
var ret = false;
var file = $("#vignette").val();
var address = window.location.protocol + '//' + window.location.hostname;
$.ajax({
  url: address + "/admin/img/" + file,
  success: function(data){
  alert("Image existante (erreur avec le nom du fichier)...");
  ret = true;
  },
  error: function(data){
  ret = false;
  }
});
return ret;
});
});

How can i prevent a submit button if succes data

4 Answers4