CODEWITHSUNDEEP
phphtmlforms
user2615947
user2615947

Reputation: 155

Trying to make 2 different forms with 2 different action

I need little help i am making an upload page, so i have two different forms and two different action

  1. form is ajax picture upload (profile picture of user) its working fine action is action='ajaximage.php'

  2. 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

Upvotes: 1

Views: 168

Answers (3)

Arthur Nicoll
Arthur Nicoll

Reputation: 391

@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 .

Upvotes: 0

greydnls
greydnls

Reputation: 342

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/

Upvotes: 0

bwoebi
bwoebi

Reputation: 23777

You need one submit button for each form. A submit button will just submit the form it is in.

Upvotes: 1

Related Questions