qTip and Forms, how to access form input/elements/form data?

[lancelot_one]

Hi! I'm a new user here and first off just want to say thanks for a really useful set of software!

We are hoping to integrate qTip into our software at MediaBlinkk.com.

I ran into a problem and a search in the system didn't come up with an answer so here goes...

In our software we have a developer's page where you can click on a bunch of images, and each image clicked on then displays a qTip popup with an html form in it for gathering user data.

We grab the rel attribute during this process, parse it and then populate the form in the current qTip popup with that. That part works great! Way cool!

We are using the JQuery Form plugin as well.

Our goal is if the user then changes the form inputs in the qTip popup, that we then can access the changes to the input elements in the form in the currently active qTip Popup being displayed. By using an on submit for the form in the QTip popup for that image. We then populate a second form with them. This part's, not working so well in that we can access the form elements using dom and the form on-submit located in the qTip, but they aren't always what we expect.

We'll then submit through that second larger form with a bunch of added info, basically the second form then gets submitted using the JQuery Form plugin.

Any qTip gotchas I should be aware of in doing this? Any ideas/help much appreciated.

What's the best way to access the form input values for a form in a qTip?

Will each qTip popup, have it's own instance or dynamic code? Even when closed? Or do they all write over the same space when the qTip popup comes up?

Thanks!

-C

[lancelot_one]

Hi! In giving this some thought, I think the problem we are experiencing is that our qTip is set to hide the popup instead of destroying it and creating a new one for each one when clicked.

Hence it's like duplicates get created in the memory space, with the same name, one on top of the other and then hidden, each time a new elements popup is opened. So basically when you try and access form data from the current one open, it always only accesses and takes you to the very first data space's form elements from the first popup, instead of accessing the current data space's form from the current popup.

I think the solve for this is to set qTip to hide and destroy on close and to open a new popup each time.

How does one set qTip to hide and destroy on close and to make sure to open a new one each time?

Any help is much appreciated,

Thanks!

-C

[lancelot_one]

Hi we were able to get around our problem by passing the form object to a javascript function onsubmit for that form located in the content of the current qTip that is open.

example: onsubmit="checkElement(this);"

This allowed us to get any data we needed from the currently open form in the qTip content without having to worry about either the id or where it was located on the stack.

We then used this javascript function as a way to display or debug the form located in the currently open qTip Content area.

JS Code

function showElements(oForm) {
  		var str = "Form Elements of form " + oForm.name + ": \n";
  		for (i = 0; i < oForm.length; i++) 
      		str += i + ". " + oForm.elements[i].name +": "+ oForm.elements[i].value + "\n";
  		alert(str);
	}

This all worked great, it also then allowed us to dynamically bind the form in the qTip Content to our JQuery Form Plugin dynamically by using the reference.

The only problem we encountered was that it seems qTip doesn't like to allow file inputs in the forms contained it's Content area. Because forms that worked correctly uploading files outside of the qTip, gave us this error: Notice: Undefined index: fileToUpload when tried in a qTip Content area.

We'll open a new thread for being able to have a file upload form in a qTip popup content area. But if anyone has a suggestion or code to do it we'd be much appreciated. Or if anyone has placed an upload file form in a qTip and can provide suggestions, that would be way cool.

Thanks for any help,

-C