Hi,
There is a Mail sending scenario in my project.It takes little bit time to process.so i thought to add a 'Loading Image'.After clicking the send button the 'Loading image should be displayed until the process stops.
my HTML code is given here:
- <div id="abc" >
-
- <div id="loadingmessage"style= "display:none; z-index: 9999;
- width: 100px;
- margin-left: auto;
- margin-right: auto;
- margin-top: 28%;">
- <img src="~/Images/Bank/ajax-loader.gif"/>
- </div>
- <div id="popupContact">
-
-
- <div id="form">
- <img id="close" src="~/Images/Bank/3.png" />
-
- <h2>Confirm your email</h2>
- <hr>
- <div class="dummy">
- <label> To :</label>
- <input id="name" name="email" type="text">
- </div>
- <div class="dummy1">
- <label> Subject:</label>
- <input id="email" name="email" type="text">
- </div>
- <div class="dummy2">
- <label> Message:</label>
- <textarea id="msg" name="message" ></textarea>
- </div>
- <input type="button" id="submit" value="Send" />
- </div>
-
- </div>
-
- </div>
My Java script /jQuery code is :
- $("#submit").click(function () {
- $("#loadingmessage").show;
- if ($("#name").val() == '') {
- $('#name').focus();
- }
- else if ($("#email").val() == '') {
- $('#email').focus();
- }
- else if ($("#msg").val() == '') {
- $('#msg').focus();
- }
- else {
- var model = {
- To: $("#name").val(),
- Subject: $("#email").val(),
- Message: $("#msg").val(),
- }
but here the Loading image is not showing after the click event.
Help me if anyone can solve this..