404 Not Found
404 Not Found

Reputation: 1223

how to trigger div on form submit

i am newbie in jquery... just started learning it...

i stuck in one problem is when i click on Open Model anchor link it's triggering Open Modal div and it will give one popup window with content of Open Modal div... that code is below...

  <a href="#opneModal"> Open Model </a>

<div id="openModal" class="modalDialog">
   <div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Congrats..</h2>
    <p>Now you can apply discount.</p>
   </div>
</div>

you can take look of output here

till now everything is working fine. but now i want to open popup window (trigger OpenModal div) when i submit the form... the submit form code is below...

    <form action="" method="POST">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

    $('form').submit(function(){
        //which code i should write which will call **OpenModal div**
    })

Thanks in advance

Upvotes: 1

Views: 909

Answers (4)

Mirko Cianfarani
Mirko Cianfarani

Reputation: 2103

till now everything is working fine. but now i want to open popup window (trigger OpenModal div) when i submit the form... the submit form code is below...

I think that you say of a modal dialog.

I created the question , I think that I wrong the title because is difficult for search it. I worked with method GET and I have no idea if this work with also with method POST but you can try.

Now I explain how to work.

You use this form and I say of see the action.

<form action="" method="POST" id="forma">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

I suggest you of replace

<input type="submit"  id="send" value="SUBMIT" class="button" />

with

<input type="button" value="Clicca qui" onclick="start()" />

Because now not send the form.

I explain the function start

function start() {
var $fm = $("#forma");
                $.post($fm.attr('you action is form'))
                    .done(function(data, ok){
                    var fr=$fm.serialize();
//now you can open the window popup and you can pass the variable fr or not. the important //that you not lose this contain of variable. When you close the window you say on server or //site that you go at address.
//With document.location.href="index2?"+fr; if you site is localhost:8100/index?bla=2&l=3
//document.location is localhost:8100 and document.location.href is the part index?bla=2&l=3
//then you have to go the localhost:8100/upload (look the action) you have to use
//document.location.href="upload?"+fr; 
//now I make the action 's form with this script


                    document.location.href="index2?"+fr;
                                    })
                    .fail(function(data){
                    alert('call failed');
                    // call failed for some reason -- add error messaging?
                    });

}

Upvotes: 1

Feanor
Feanor

Reputation: 3690

//then here is your code
$('form').submit(function(e){
        $('#openModal').fadeIn()
        e.preventDefault()
    })

Upvotes: 0

Adam Azad
Adam Azad

Reputation: 11297

I think you want (When you submit the form the dialog will be displayed:

$('#send').click(function(foo){
     foo.preventDefault(); // you can remove this if you change #send type to button

     $('form').submit(function(){ // submit the form and show the dialog
        $('#mylink').click();
     })
});

Upvotes: 0

piscript
piscript

Reputation: 419

Your jquery code should go like this

$('form').submit( function(e) {
    $('a').trigger('click') //or open model directly
    e.preventDefault();
});

Upvotes: 0

Related Questions