I have a bit of a problem achieving what I'm trying to do.
I'm doing a mailbox like page and I'd like to add a "Respond" button which will fill a form with some values.
I'm generating my page message by message in php. For each message I generate an input button with its own id and when I click on the button, I'd like to open a form in a new window, with the recipient and title prefilled and not changeable by the user, with another textarea that the user can fill with his message.
For that, I have a general template for a form containing 3 values (recipient, title and message). All are (for the moment) text or textarea values.
Is it possible to use one form to send a message to anyone, or do I have to generate a form for each message with pre filled values ? The last solution seems quite horrible to do.
I tried to find something that I could do with only javascript, since I want the form to be submitted asynchronously by Ajax.
I can make an onClick event and pass the values to that function, but in that case I won't have the values of the textarea the user will have entered.
Is there a way to do, for example, an entire form in Javascript with the values I'll pass through the onClick event, get the value of the textarea from the form that would have been populated with these values, and then send everything through Ajax ?
Well, here is what I did.
For each Respond button generated, I set an onClick event passing the fields I wanted to be pre-filled in my form to a JS function RespondMessage()
I also made a form at the bottom of my page that I hid with css.
This form contains as much hidden fields as I want pre-filled datas, and as much spans as I want to show infos.
When I call the RespondMessage function, I manually set the hidden fields in my form with the arguments I called the function with.
After that I fill my spans with the infos I want to show (for example, I set the recipient's name for my message like that).
Once all of that is done, your form is ready to be displayed. So after setting the fields in the form, I just pass the form from display:none to display:block, and do a lot of css tricks to make that smooth and beautiful.
So now you have your pre-filled form, you just need another function that will make an Ajax call to avoid reloading the page after each response, and you'll call it with the onClick event of your form's submission button.
I hope that this process will help someone.
I'm not quite sure that it's the best way to do it and I find it quite dirty and exploitable so you need a bit more server side checking than usual, but it does the job.
I don't provide code because it's mostly all really specific to the application you're setting up.
Related
I'm using ajax to create list of replies.
In the end of the list I added textarea form that allow user to add reply (also with ajax).
The problem is that i call to my JS in my main PHP page so when user want to submit reply the page doesn't "know" the js code. If i add the js to the ajax php file/page the code will work but then it will be duplicated many times and when user will submit form the text will be submitted many times...
In my console i see that the JS file duplicate every time i load the replies list
How can i prevent it?
Disable the submit button right after user presses it once. Using jQuery:
$("#button").attr('disabled','disabled');
Make sure to remove disabled attribute on AJAX error so user can re-submit the form with new data. You can remove disabled attribute like this:
$('#button').removeAttr('disabled');
[improved]
if you want to not repeat data when navigation or F5 press, simply free the $_POST vars after doing whatever you want, and check if isnt set (before clean, of course) redirect you wherever you want. example:
/* HERE do the job with ajax response. */
if(!isset($_post['foo'])) header('Location: wherever.php');
$_POST['foo']=NULL;
If you're using $_GET... don't do it, use $_POST... $_POST is your friend.
Finaly ensure that if you press F5, you don't re-send form vars by post (otherwise you will get the same). If it's happening, clear your inputs with jQuery on page load.
$('#inputID').val('');
I'm just trying to understand the submit button within php.
I know that it performs that action stated within the form tag. So basically what I have is an form tag that only defines it's ID, i.e. no method attribute nor action. And within this form is a submit button. This input element only defines the type as submit, i.e. no name attribute nor id nor value.
Quickly describing the file: It has two input text elements which are required and a submit button. When i view this file in chrome, and i've clicked the submit button, a pop up shows below the required fields which i have not entered text in stating "required field".
I love this function however, it doesn't check for spaces, i.e. " ".
So back to my question, could someone possibly tell me what the submit button actually does or possibly what methods does it call when i click on it even though the form it is in has no action defined.
When the button is clicked, the browser detects this and submits the form back to the server. This has nothing to do with PHP, it's simply the browser implementing what the HTML specification stipulates.
Since your form does not have an action attribute, what happens is that the browser gathers the values of all eligible input controls in the form, turns that into a query string and makes an HTTP GET request to the current URL using that query string. The HTML5 spec covers this in detail.
The submit button offers one possible interface for the submission of the form. It's like the send button for a text message. While there are alternatives to submit the form, the submit button is the HTML option.
When a form's action is empty, the form submits the GET data to the page that form is on. (Basically, it reloads itself, with the new form data attached.) So you could write your PHP code at the top of the same page to manipulate the data.
In your PHP code at the top of the page, you can test whether or not your form sent data in those two required fields. If one or both are empty, you can echo a message to the user telling them the fields are required.
Basically I have a bunch of data I get from a database and put onto my page in a table. Right now I have the user type in the name, session, etc. in the table and that is sent as post data into the next PHP page, which I then use to lookup more stuff in the DB and so on and so forth.
Obviously that's not a great user experience; it would be much easier to simply CLICK the item in the table and everything gets sent automatically into the next page.
I'm not sure how I'd go about doing this.
My tables are first and last names for now, so if you click a certain row it should go to the next page sending each cell as data.
EDIT: Some examples:
Traditionally you do this with a form
<form method="post" action="pageDataIsGoingTo.php">
to send data to the next page. However, I don't want to do this with a form; but rather when they click a URL and/or button that sends the data. I can "hide" the data from view I suppose, but I still don't know the function to actually go ahead and do that.
Would I make a javascript button/function that sets something in an invisible form?
You can use invisible/hidden form fields.
That might be your best guess.
Javascript would be a good solution if you wanted an ajax POST call, but you want to load other page.
So hidden form fields are your solution.
Parallel with table data.
You need to embed hidden fields and your visible item row within a form
(so each item row contains also a form & hidden form fields and visible submit button,
which you can style with css)
This presuming that your table contains more items which you can choose to send.
Although I would do this with backbone & jquery and do it all in ajax.
I am new to html, I would be really glad if you can help me with this.
I have a web page where there is a list and some other text inputs and buttons. This option list can be populated by clicking the "add" button in the page, this add button is to direct to another page and in that page there are some chekboxes, those which are checked are loaded back to the main page,(where I have the list) .
At the end data in the main page needs to be loaded to the database, (what is in the list and in the text inputs).
Since I'm new I just know little about php and html, I thought I should have a form within a another form(form to "add items", form to load to the database) and it is not possible in html. Can anyone suggest the best way to do this? Do I need to use javascript?
Why can't the extra inputs (the ones that would be in the second form) be part of the first form? I think the question will become clearer if you post a sample form so we can see the relationship between the two forms.
But overall, since you're ultimately only submitting one form, then maybe all the inputs belong together. If what you're calling the second form isn't supposed to be visible right away, you can still have it be part of the same form, but only reveal it when needed.
Again, some sample data would help to understand the exact context of your question.
in php if you use input name="somename[]"
for a number of input elems
you will get an array in $_POST['somename'] and access all the values.
I think what you're after - if I understand you correctly - is ajax. Ajax allows you to asynchronously send data to/from another script without leaving the current page. This is accomplished using JavaScript. In your case I think what you need to do is set an onclick event in JavaScript to a button:
<input type="button" onclick="javascriptFunction()">
You can read more about ajax here:
http://www.tizag.com/ajaxTutorial/ajaxform.php
I have a form I need to auto fill it using Ajax and php. Suppose My unique field is mobile number. So when form appears firstly person has to fill mobile number. If mobile number exist in the database than all the rest field retrieve its value that is his name, email etc, making all the text fields disable.
my approach to this work is on blur effect I can send value through AJAX. but how call values in array. I have called only single value through echo; but have not called array back from java script page.
Secondly I need jquery to fill all form with respective values and disable particular fields in form.
Please give me some more idea to make this approach better and provide some hint to implement it efficiently.
have you tried Autocomplete from JQuery UI?
http://jqueryui.com/demos/autocomplete/
it is very easy to use, it uses ajax and can be easly used with php. Tell if you will have any problems.
A simple way to do this is to separate your page into 2 forms. The first form will contain only the mobile number field, while the second form will not be initially visible. This way, the user will be forced to fill in his mobile phone before doing anything else.
Submitting the first form will trigger an ajax call to your php file which will check whether the mobile phone exists in the database or not. If it exists, it will return a pre-filled form. If not, it will return an empty form. Therefore, there is no need to change the values of the fields with javascript. Now, all you have to do is to take the response of the php and put it into a div under the first form.