Form framework for inputs specified by custom popup window - php

I have a PHP based form. For many of our inputs, the user clicks an html which created a custom popup window with a "mini-form". When the user clicks on the submit button, the values from the "mini-form" are sent to the main form to hidden inputs using JavaScript. This can become complicated to do, especially with validation and other complications. I know there are a million PHP frameworks for forms, but I can't find one to deal with these situations.
Does anyone have advice?

My understanding is that you are opening new form using var win = window.open() now using the win reference you might be populating the actual forms data. This is old good approach which is been working well from long time.
If this is correct Then I think that if you would really want to do it in better way you should start with JQuery UI.

Related

Ajax - multi-lingual pages with forms

I am trying to understand if the following scenario is possible:
a .PHP page that has a form and inputs for the user to submit information
The page itself offers several different languages for the user to view it in
The user can change languages but the form and the inputs retain their values (if the user has added information) - so the page cannot be re-loaded (as it would lose the information)
I think this might be achieved using an Ajax solution but I'd appreciate any thoughts or advice.
You actually want to change the page, so reload might still be the best choice. Otherwise you need to change every string on the page with javascript, which can get tedious.
You can do the reload without loosing the data. Just add the language information to the form and send another parameter to avoid the actual action that would normally happen when you send the form on the php side. Render the page in the new language and insert the transmitted data in the form.

How to prevent a modal from being drawn more than once?

This is a bit more abstract than the usual questions which I know goes against the spirit of things, but I'm hoping that I can still get a good response.
Here's the issue. We have a fairly complex web application that is written in PHP. The purpose is relatively unimportant, but simply put: We are using Comet / AJAX / JSON / JavaScript / PHP / MySQL (NO jQuery, however, native JavaScript only) to render controls that display data in real time. Throughout this application we are rendering popup modals using native JavaScript. It's fairly complex logic that tests for the existence of a modal with the same name on the page and prevents creating new versions of the same, and of course once created a layer is created to prevent interacting with links beneath.
The issue is that we have at least one modal that can be called multiple times before it is rendered on the page due to the time it takes the AJAX call to collect data from the database and assemble it for presentation. If a user were to 'double click' on said link they would be presented with two modals, one on top of the other. I've been able to actually render 8-10 of these. Interacting with the topmost modal appears to be broken because the user is actually effecting collapsible headers on the bottom-most modal. Once you start closing the dialog boxes and get to the bottom you can see where you've clicked.
So, my issue is this: What is the best way to prevent this behavior?
I've considered simply adding a function to the onClick event that would remove the onClick attribute from the link after the first click with a minor timeout (say 500ms). I've also considered trying to implement bit testing logic that would count clicks and only actually first the event after the first click and reset when the modal is closed.
What I'm wondering is if someone has any thoughts or suggestions or even has tackled a similar issue and has some insight on best practices to accomplish my goal in this instance.
Thank you very much.
You can unregister the click handler once it fired:
var element = ...,
myClickHandler = function(event) {
// ...
element.removeEventListener('click', myClickHandler, false);
// ...
}
element.addEventListener('click', myClickHandler, false);
In this case, I found the simplest solution to be the best but I would still love to hear other feedback if'n it's out there.
In this case I found that the order of operations was the issue. I was awaiting the AJAX response to generate the body html for this modal. I changed the order to instead create the modal immediately using <p>Loading...</p> within the body of the modal. Then, when the AJAX was completed and I had my new body text, I just injected it into the modal's content area with a neat bit of code and Bob's your Uncle, we had jackpot.

How do I create a form without refreshing the page at the same time the data goes into a mysql data base?

Ok, I know there have been a few questions posted on this but a lot of the information are dotted around and not necessarily connected in one form that I need for my site.
Basically I want to create the style/functionality of the twitter form on their home page.
Where inside the input fields are the labels, and when you click on the input the fields the labels don NOT disappear but fade into a different colour. Its only when you type, is when it disappears.
If they don't type and press submit I want the verification signs come up ( I know how to do this but it seems to be conflicting when I put the jQuery code in)
When all fields are inputted I would like the form to fade and represent a thank you message whilst
the data gets placed into a mysql ( specifically a MAMP/PHP My Admin) database.
Very similar to this form on hbuddy.com
Would massively appreciate if this was responded in a step by step format, simply because i am at the beginning stages of learning pretty complex programming language.
Thanks!
you can try jquery ajax for form submission..
These links will help you for getting started..
http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/
http://www.9lessons.info/2009/04/submit-form-jquery-and-ajax.html
http://www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/

How to use form information to auto populate a form on another webpage

I am trying to figure out a way that I can populate form fields on webpage for my users much like password managers do. The problem is that I am not the owner of the second webpage. I thought about using javascript with iframes but that doesn't work. I've tried using php to replace the form information adding values saved from my previous form. But I need to add info on a second form after the first one is submitted. After I submit the first page I am off my page and can't change anything else. So I'm kinda out of ideas and my knowledge is limited. Any ideas or input would be greatly appreciated. Thank you for your time and effort.
Cannot be done because of the SOP (same origin policy) enforced on JavaScript code. An alternative would be through XSS, other via a bookmarklet, and as a last choice trough a GreaseMonkey script.
GreaseMonkey may be your best choice, if the data to be filled in is from your website. Best choice because GreaseMonkey scripts can perform cross domain ajax requests.

How to dynamically change data in the HTML textarea or text field with php?

I will have a web-application which will use a few complex forms. One form will have examples field on the top and field for user on the bottom. There will be approximately 10 examples. It will be great if i can change text and images without reloading full HTML page.
Form will be based on HTML. Php will do all logic processes. I haven't find information about HTML button - can i use it for this problem or i need just several submit buttons in the form?
How can i implement this using HTML and PHP?
Thanks in advance.
You can't do this with PHP alone, because it runs server-side and would force you to reload the page.
This is usually a job for Ajax, which is a technique to make JavaScript-based calls to URLs without reloading the current page.
The jQuery framework has one of the most popular and straightforward Ajax implementations.

Categories