Issues with popup window

Hi,

I have a popup window that has a form to submit the data.  
when I click on the submit button, It is submitting to the page and opening a new window instead of submit the form and
keep the popup window open.

the issue is when I submit the form on the popup window, the popup window disapear and open up a new blank window with the popup page information on it.


//This is the popup window


function CQticketRslt()
		{
			$("#CQticketFrm").attr("action","FindCQTicket.cfm");

			$('form#CQticketFrm').submit(function() { // catch the form's submit event
    			$.ajax({ // create an AJAX call...
        		data: $(this).serialize(), // get the form data
        		type: $(this).attr('method'), // GET or POST
        		url: $(this).attr('action'), // the file to call
        		success: function(response) { // on success..
            	$('#ViewFindTicketdialog').html(response); // update the DIV
        		}
    		});
    		return false; // cancel original event to prevent form submitting
			});
	
		}




  <FORM id="CQticketFrm" NAME="CQticketFrm" METHOD="POST" ACTION="">

 <input name="CQTicketID" id="CQTicketID" type="text" size="45" />

<img src="images/SearchBtn.png" onclick="return CQticketRslt();" width="139" height="28" />

</form>

Open in new window


//This is the parent window

function FindTicket()
	{
		$("#ViewFindTicketdialog").load('FindCQTicket.cfm').dialog({
 		//height: 625,
 		width: 800,
		position: 'top',
 		modal:true
		});	
	}


  <div id="ViewFindTicketdialog" name="ViewFindTicketdialog" style="display:none" title="Find CQ Ticket">  </div>

Open in new window

1.jpg
lulu50Asked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
Instead of placing your AJAX code in a function do this
<script>
$(function() {
  $("#CQticketFrm").attr("action","FindCQTicket.cfm");
  $('form#CQticketFrm').submit(function() { // catch the form's submit event
    $.ajax({ // create an AJAX call...
      data: $(this).serialize(), // get the form data
      type: $(this).attr('method'), // GET or POST
      url: $(this).attr('action'), // the file to call
      success: function(response) { // on success..
        $('#ViewFindTicketdialog').html(response); // update the DIV
      }
    });
    return false; // cancel original event to prevent form submitting
  });
});
</script>
<button><img src="images/SearchBtn.png"  width="139" height="28" /></button>

Open in new window

Sample code here
Sample opens form with button - sends data to script that reflects it back - the form is then closed and the response shown in the response window.

The form demonstrates the use of an <img> as a button as well.
lulu50Author Commented:
Julian,

I don't want the popup window to close.
the user enter search criteria in the popup window then click on search
it should return the a list of result on the same popup.
lulu50Author Commented:
I tried the example but it didn't do anything
Become a Microsoft Certified Solutions Expert

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

Julian HansenCommented:
I don't want the popup window to close.
the user enter search criteria in the popup window then click on search
it should return the a list of result on the same popup.
Then don't close it - the solution is the same - just without the line that does the closing.
Refer updated sample that does not close popup (http://www.marcorpsa.com/ee/t1180a.html)
Changes
1. Removed the  $('#myModal').modal('hide')
2. Moved the <div id="ViewFindTicketdialog"></div> inside the modal.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Julian HansenCommented:
I tried the example but it didn't do anything
Yar, that's our ISP - they are having some server issues this decade where occasionally the server sulks and won't talk to you - you need to give it a few tries but it will get there.  Moving to new hosting provider soon.
Julian HansenCommented:
Just to confirm what the sample does.
Click Open Form - opens form
Fill in Name, Surname and email
Click the bottom right button - changed it to right arrow - this was a demonstration of how you can use an image as a submit buton - close icon might have caused some confusion
The form is posted by AJAX to a script that basically reflects the post variables back to the sending page which then displays that return in the #ViewFindTicketdialog div.
lulu50Author Commented:
I don't know what you mean by this:

"2. Moved the <div id="ViewFindTicketdialog"></div> inside the modal. "

The div in on the parent page, I should move it to the popup?
lulu50Author Commented:
Julian,

IT'S WORKING NOW!!!!!

GREAT!!!!!

THANK YOU !!!!!! LOL
lulu50Author Commented:
Thank you
Julian HansenCommented:
You are welcome.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.