Help with SweetAlert and submit button – JavaScript – SitePoint Forums

This SweetAlert works efficiently upon the Kind submitting:

                $('#upload-form').on('submit',operate(e)
                    e.preventDefault();
                    var kind = $('kind');
                    swal.fireplace(
                        title: "Are you positive?",
                        sort: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "Sure, submit it!",
                        closeOnConfirm: false
                    , operate(isConfirm)
                    		console.log("sdfsf");
                        if (isConfirm) kind.submit();
                    );
                );

nevertheless, it doesn’t show for longer than two seconds, earlier than the Kind robotically submits.

The SweetAlert is meant to remain displayed and permit the verify button to be chosen to proceed.

(that is totally different than my different posting, in that this code isn’t within the BeforeSend operate – thanks for the replies).

Any help is welcomed…

(It was prompt to make the Submit button a button that opens the alert, and make the Kind’s submit-btn button the swal confirmButton…however I’m unsure how to do this (however I’ve tried))

So… on kind submit, you create a verify dialog… that… submits the shape…

…

I really feel like that is going to go round in circles…

Thanks in your message.
upon Kind submit, a verify dialog field seems, I wouldn’t say that the dialog code submits the Kind, as a result of it’s not displayed lengthy sufficient for somebody to click on the displayed dialog field selections, both ‘Sure, submit it” or “Cancel”.

it was prompt making an attempt having the submit button not submit the shape, have or not it’s a daily button, not a kind submit button, so then, when that common button is clicked, make it SweetAlert Swal.fireplace, after which make the “sure, submit it” be the submit button. However I haven’t been capable of get that right, in my makes an attempt at switching these buttons.

I sit up for any steering

… i’d say it does? Trigger you wrote these precise phrases into it?

That’s not whats making it submit now, nevertheless it’s going to be an issue within the fast future.

From what your earlier thread mentioned, i’m guessing you’ve nonetheless received code lingering round listening to the unique kind submit and its firing on this one. Unattainable to inform with out seeing the total web page.

Thanks once more in your reply.
Right here’s the total code, in case you might take a look over it, that might be nice.

The JS we’re discussing is round line 285
and the submit button for the shape is round line 378.

I sit up for your feedback.

so… #upload-form is a div.
a div won’t ever fireplace an onsubmit occasion… not less than, it shouldnt be.

Your kind is submitting itself, earlier than the alert can intervene. Spark off of (and stop default from) the precise kind.

Or dont even make the button within the kind an precise submit button, and have the button execute the alert and submit. Which might be the higher route.

<button sort="submit" id="submit-btn"
Take away sort.

$('#upload-form').on('btn-submit',operate(e)
“btn-submit” isnt an occasion sort, so this code won’t ever fireplace.
change to
$('#submit-btn').on('click on',operate(e)

var kind = $('kind');
Too imprecise – you’ve received a number of types on the web page, so that is going to find-and-fire all of them.
var kind = $('.pt_upld_page_frm');

Many thanks in your type help.
I’ve made the prompt adjustments:

                $('#submit-btn').on('click on',operate(e)
                    e.preventDefault();
                    var kind = $('.pt_upld_page_frm');
                    swal.fireplace(
                        title: "Are you positive?",
                        sort: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "Sure, submit it!",
                        closeOnConfirm: false
                    , operate(isConfirm)
                    		console.log("sdfsf");
                        if (isConfirm) kind.submit();
                    );
                );

and:

<button id="submit-btn" class="btn btn-main setting-panel-mdbtn" disabled>< and many others....

and upon continuing with an add, the dialog field shows when the Submit button is clicked, and it efficiently stays open till the dialog field button alternative “Cancel” is chosen, and the dialog field closes/disappears. That’s an enormous enchancment. A lot thanks.
Nonetheless, when the opposite dialog field button alternative “Sure, submit it!” is chosen the dialog field closes/disappears, and the Kind isn’t submitted. Upon clicking the Submit button once more, the dialog field opens once more.
I sit up for your feedback and any assist with getting the “Sure, submit it!” button to submit the Kind.

so I cant discover an choice on the SweetAlert web page that matches “closeOnConfirm”, so one thing’s incorrect within the demo you’re utilizing for example.

swal.fireplace ought to return a Promise. And based mostly on their example “A confirm dialog, with a function attached to the “Confirm”-button” on their web site, what it’s best to do right here:

is as a substitute finish the hearth and tack onto the Promise…so…

).then((end result) => 
  if (end result.isConfirmed)  $('.pt_upld_page_frm').submit(); 
);

To be clear, you’re utilizing sweetalert2, proper?

Thanks, sweetalert2 I imagine so.

Per your suggestion:

                $('#submit-btn').on('click on',operate(e)
                    e.preventDefault();
                    var kind = $('.pt_upld_page_frm');
                    //var kind = $('kind');
                    swal.fireplace(
                        title: "Are you positive?",
                        sort: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "Sure, submit it!",
                        closeOnConfirm: false
                        ).then((end result) => 
						  if (end result.isConfirmed)  $('.pt_upld_page_frm').submit(); 
);
);

“sure, Submit it!” now closes the dialog field and directs again to the choose a file to add web page,
however the file isn’t uploaded.

As chances are you’ll recall, in the direction of the underside of the file you’ll see:

   $('#upload-form kind').ajaxForm({
      url: 'LINK aj/ffmpeg-submit?hash=" + $(".main_session').val(),
      beforeSend: operate() 
         $('#submit-btn').attr('disabled', true);
         $('#submit-btn').val("LANG please_wait");

 ,

      success: operate(knowledge) 
         if (knowledge.standing == 200) 
            //window.location.href = knowledge.hyperlink;
window.location.href="https://information.google.com/__i/rss/rd/articles/LINK dwelling";
         

the place it exhibits when the file is definitely uploaded the redirect is to the house web page.
So, in some way the sweetAlert isn’t importing and redirecting correctly.

Any concepts are welcomed.

properly because you’re taking management of the submit circulation anyway, i’d simply use ajaxSubmit within the then as a substitute of establishing the shape with ajaxForm after which counting on the secondary circulation of submitting.

I significantly recognize your reply and suggestion, I simply don’t know the way to do this from a code standpoint. Unsure the best way to ‘use ajaxSubmit within the then’. I’d be thankful for any extra steering with that coding

So the identical place you realized to make use of ajaxForm, you’d take a look at ajaxSubmit.

A lot appreciated for the clue, however that’s unclear to me on the best way to accomplish what you’re saying

                        closeOnConfirm: false
                        ).then((end result) => {
						 //if (end result.isConfirmed)  $('.pt_upld_page_frm').submit(); 
						  if (end result.isConfirmed)  $('.upload-form').submit(); 

I attempted this with out success (no submission)
any extra steering is appreciated

take the choices in your ajaxForm code, put it into an ajaxSubmit operate as a substitute, put that inside your button handler.

Thanks once more.
Tried sveral issues with out getting the code right.
If anybody want to present an instance of ” take the choices in your ajaxForm code, put it into an ajaxSubmit operate as a substitute, put that inside your button handler”. the steering could be significantly
appreciated.

So what have you ever tried?

Or ought to I ask which web site I needs to be to search out the final individual that wrote your code for you in order that we all know what it appears to be like like now, contemplating you’ve been posting this code for the final 2 years between this web site, codingforum, reddit, phpfreaks…

You appear to be utilizing code you discovered someplace that doesn’t do precisely what you need it to do and try to vary the codes operate with out understanding that discovered code.
Step one on this state of affairs is knowing the code you’ve gotten. With out understanding that code how are you going to hope to vary it to do what you need it to do.
My understanding is that you really want a message displayed for a predetermined time when submitting a kind.
To show a message earlier than submitting the shape utilizing jQuery is both unattainable or very troublesome. Doing it in vanilla jScript is straightforward, so are you able to toss jQuery apart and use present greatest apply jScript?