I need little help i am making an upload page, so i have two different forms and two different action
form is ajax picture upload (profile picture of user) its working fine action is action='ajaximage.php'
form is simple user info details like Name,Bio, etc etc. its also working fine.. and its action is action="add.php"
Doubt/Problem
In my website input boxes are not arranged orderly because of the design.
<form id="form" method="post" enctype="multipart/form-data" action='add.php'>
<b>Tittle</b>
<input type="text" name="name">
</form>
<form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'>
<input type="file" title="Choose Image" name="photoimg" id="photoimg">
</form>
<form id="form" method="post" enctype="multipart/form-data" action='add.php'>
<b>Description</b>
<textarea name="description" rows="1" cols="1"></textarea>
<button input="submit">Save Changes</button>
</form>
Ajax image uploader is working but in case of add.php it is working only for Description.
I cannot change the design so how can it be solved ?? Please Help
You need one submit button for each form. A submit button will just submit the form it is in.
#bwoebi is right about the submits but I'd be very surprised if your arrangement would work anyway. By my reckoning you have 3 forms. Just using the same name again wouldn't work. A single form needs to be distinct - unless you want to do a whole lot of javascript processing on submit. Have another look at fixing your layout to keep forms together.
Just saw your comments above. Why have separate forms with separate actions anyway? Why not have one form with one action that simply does both the file upload and adds the details (presumably to a database)?
You could also simply have different submit buttons on your form and add an onclick attribute to each setting the action for the form to be different:
<input type="submit" name="sub1" value="Upload Image" onclick="document.myform.action='ajaximage.php';">
<input type="submit" name="sub2" value="Add User" onclick="document.myform.action='add.php';">
This means the form action will be changed depending on which submit button is used .
To upload images via ajax you do not need to submt a form, that is the whole point of doing it via ajax. You can upload the image, and then submit the form for the text inputs.
pseudocode:
<form id="form" method="post" enctype="multipart/form-data" action='add.php'>
<input name="name"/>
<input name="profilePic" id="profilePic"/>
<input name="descrption"/>
</form>
You can then use javascript(I prefer jQuery) to upload your image via ajax, specifying #profilePic.
Also, you should look at: http://blueimp.github.io/jQuery-File-Upload/
Related
i use a form in which i get a file from user and submit it with button and take the values to another page with help of post(method). On the other page i have some business to do with that file beside that i have another form on that page. Now i want when submit that form (as it execute the php self script) so i want beside the new values i get that same file again. i try different technique like putting the tmp name in a variable but that doesnot work and even i create another file button in the form of that page but i am unable to give it a value. In short i need idea how to get the file on submittion of that second page form which is send from first page ?
For simplicty let me show you an example so you understand my problem,
//the first page form
<form method="post" enctype="multipart/form-data" action="uploadExcelData">
<label for="csv_file">Upload CSV File</label>
<input type="file" id="csv_file" name="csv_file" />
<input type="submit" name="upload" class="btn btn-primary"
value="upload" />
</form>
//on submit it goes to another page which have this php code and html form
<?php
$file = $_FILES['csv_file']['tmp_name'];
if (isset($_POST['save'])) { // the second form on submit
echo $file; //this show nothing
}
?>
<form method="post" enctype="multipart/form-data">
<input type="submit" name="save" class="btn btn-primary btn-block"
value="Upload" />
</form>
keeping above code in mind i hope somebody will understand the problem and suggest me something but i just summarize my code too much the second form also have many combobox etc and also i tryed to have a second file tag in second form but the problem is i cant even assign the file value to it so that it is selected automatically.
i want to get the file as output which have that shitty excel data!!
I have a smarty project, and in the .tpl file, there is a form:
<form method="get" action="{$smarty.server.PHP_SELF}?action=func1">
<input type="text" name="username"/>
<input type="submit">
</form>
there is a question, if the php file have many function for different action requests, so in the template if have many forms, I want to through the action for distinguish.
but in my practice, see upper code, I write like this, this can not delivery the action to my php file.
I want to write the action in the form action, because this can be more standard. so I don't want to write it in a hidden input. why write in the action can not pass into the php file?
You could use submit button with specified name and value:
<form method="get" action="{$smarty.server.PHP_SELF}">
<input type="text" name="username" />
<input type="submit" name="action" value="func1" />
</form>
and then you'll get a global variable $_POST['action'] with value func1. But the value will be showing on your button title, so I offer you to find forms only by submit name, for example name='submit_form1'.
I have an html form and 2 php files, all of which work well. In the form I created a preview button that references a php file that shows the uploaded cvs in an html table as a preview. The submit button inserts it into a database.
I would like to have the form contain one button that goes to the preview page and once the info is confirmed, there would be another button that references the submitted file, but I can't seem to get that to work.
Due to the environment I'm trying to get this to work without javascript or ajax if possible, as another user gave me a javascript option.
Here is the html form:
<form method="post" action="confirm.php" enctype="multipart/form-data">
<label>Upload File</label>
<input type="file" name="file">
<input type="submit" name="submit" value="Confirm" >
</form>
<form method="post" action="upload.php" enctype="multipart/form-data">
<label>Upload File</label>
<input type="file" name="file">
<input type="submit" name="submit" value="Submit">
</form>
Each Php file corresponds as well:
if(isset($_POST['submit']))
Is there any way to go from upload to preview to submit and keep reference to $file?
I have created one form to upload images for custom use
<form id="file-upload" action="" method="POST" enctype="multipart/form-data">
<div id="image-uploader-box" class="group">
<div id="forms" class="add-photo-fields">
<input type="submit" value="Upload" />
<input type="button" id="add-photo-button" class="add-photo-button" value="Add Photo"/>
</div>
</div>
</form>
Now it is working fine with uploading image and storing to proper place. But what I exactly want is auto submit above form when user submit WordPress comment. ( when user hit the submit comment button )
Can anyone help me for this? I am fine with jquery or php either way.
This is the place to go: http://api.jquery.com/submit/ (jquery's submit function)
When uploading files you can post to an iframe: How do you post to an iframe?
I try to create an upload progress bar with PHP and jQuery. However, I have a problem when I bring it to the form data. The code is similar like this:
<form method="post" action="upload.php" enctype="multipart/form-data" id="upload-form" target="upload-frame">
Suburb:<input type="text" name="txtSuburb" id="txtSuburb">
Picture:
<input type="hidden" id="uid" name="UPLOAD_IDENTIFIER" value="<?php echo $uid; ?>">
<input type="file" name="file">
<input type="button" name="submit" value="Upload!">
<iframe id="upload-frame" name="upload-frame">
</iframe>
<input type="submit" name="DataSubmit" value="Submit Data"/>
</form>
As you can see, I got 2 submit buttons. If I keep the form like this then the form can't submit data to server. It just submits the file to iFrame. If I change the action and target of the form then the upload progress function will not work.
Could anyone please help me to find the solution for this?
I want the user can click on upload button to upload their file. Then they can take the rest to fill the form. When everything is done, they can click on another submit data button to submit their data (included the file) to the server.
Make sure that you have only one input element of type submit within your form.
If you want the first button to trigger some Javascript, use a regular input element or even a styled link and attach a Javascript event to it's onclick event, then prevent it's default behavior, e.g. by returning false.
Like this only the second button will actually submit your form which should do what you're describing.
In general I'd second #Treffynnon's suggestion to use a existing library for this purpose. These hacks have a tendency to get pretty nasty, especially when it comes to crossbrowser compatibility.