I'm trying to get my form to require certain fields be filled out before the form can be submitted.
I searched and found that the command is supposed to be this simple command
<input type="text" name="name" id="name" placeholder="Name" required />
But for some reason on my form it submits it even when specified fields are not completed.
I even tried creating a brand new file in Dreamweaver with a new form with just a required input item and submit button and tried it in different browsers and it didn't work in Chrome or Safari. I copied it exactly from a YouTube video I found here with no luck http://www.youtube.com/watch?v=M73FroYgkt0
Here is my site so you can examine the code. The form is at the bottom.
http://www.YourFlyersDelivered.com
The problem with your form isn't your html, it is your javascript.
On line 33 of config.js, you have the following line:
jQuery('form .form-button-submit').click(function(e) { e.preventDefault(); jQuery(this).closest('form').submit(); });
This line is preventing the default action of your submit button, bypassing the required attribute on your input element, and submitting the form. If you remove this line, I'm sure it will work.. Examples:
Your current method of form submission: http://jsfiddle.net/Daedalus/2FY9g/ <- does not work
Without the default action prevented: http://jsfiddle.net/Daedalus/2FY9g/1/ <- works
i would use js to validate the entries
a simple validate.js file that contains something like:
function validate username(){
var user = document.getElementsByName("username")[0];
if(user.value == "") return false; }
sorry about the formatting.. im new to this forum and still getting used to it :)
Try this, add runat="server" to form......
<form id="form1" runat="server">
<input id="name" required />
<input type="submit" value="Search" />
</form>
Related
So I have a form that requires a user to submit their website to a form. Here is the html line:
<input type='url' name='link'>
And I'm using <input type="submit" value="submit" formmethod="post"> to submit the form to a php
And I'm trying to retrieve the values in my php file with:
$link = $_POST['link'];
Why isn't this working? At first I thought it was because I had htmlspecialchars() but it's not coming through without it either. I can't find anything in any google search that even mentions anything related to this kind of problem (with a type="url" form)
What do I need to do to process form data with type of "url" in PHP with a $_POST?
Get your form method to be set to post e.g
<form method=post>,
if you submit the form and in the url in your browser u can see some more inf then be sure 2 check your form method
I think this is wrong,
method="post"
Its only method, not formmethod
Also make sure, you dont have one more for element name with link.
I have a page that has a form on it. One of the things I need to include on the page is the ability to upload a file. I am trying to do this by using another form with an in it. When the user selects the file, I want to get the file name and then perform the actual upload. From what I read, I cannot submit a form within a form, because the submit button in the inner form will also submit the outer form. I have tried looking for options and found the following page.
Can I trigger a form submit from a controller?
I thought that if I used this type of directive, then submitted it with the commit, then it should work....my problem is that for some reason when I try to access the form in my controller, it is showing as undefined. I think I need the form so that I can get the file name of the selected file...there may be a different way to achieve this than what I have tried but I haven't found it yet...
The latest controller, directive, and HTML files are below.
Controller:
$scope.uploadIt = function($form) {
console.log($form);
if ($form.$valid) {
$form.commit();
}
};
HTML:
<form editable-form name="editableForm" onaftersave="update" >
<tr>
: other fields here....
</tr>
<tr>
<td>
<form ng-form-commit name='fileForm' action="scripts/upload_file.php" method="post" enctype="multipart/form-data">
<label for="exampleInputFile">File input</label>
<input type="file" id="file" name="file">
<p class="help-block">Upload a file to link it with this project.</p>
<input type="text" name="prgGuid" id="prgGuid" value="{{programId}}" style="display:none;">
<input type="button" ng-click="uploadIt(fileForm)" name="submit" value="Upload File" class="btn btn-default">
</form>
</td>
</tr>
</form>
Directive:
app.directive("ngFormCommit", [function(){
return {
require:"form",
link: function($scope, $el, $attr, $form) {
$form.commit = function() {
$el[0].submit();
};
}
};
}]);
One more this that I will need to do....when the file is actually uploaded, I will actually be changing the file name so it is unique. Once the file is uploaded, I will need to pass back the new file name to my controller so I can store/display it. So I will need the original name the user selected and the new name...my php file will pass it back. I was thinking at first that maybe I could use a $http.post to submit the form and get the information back, but I couldn't get the file name the user selected. I was thinking if I could use the http.post to process the php file, then I wouldn't run into the form inside form, submit issue.
Please can someone tell me the easiest way to accomplish uploading a file with the form inside form constraints I have? I have been trying various things from posts I have seen but on here but I haven't found anything similar....please help. Thanks.
I am trying to use the Polymer element Iron-Form to submit information into the $_POST array. However my submit button (a paper-button) - which should run the script to submit the form - does not seem to submit the form when pressed.
I'm new to Polymer and to PHP, so I'm not sure what is going wrong.
Form script
<form is="iron-form" method="post" id="insert-project-form" action="/form/handler">
<paper-input label="Project Title" name="title"></paper-input>
<paper-input label="Client ID" name="clientid"></paper-input>
<paper-input label="Working Hours" name="workhours"></paper-input>
<paper-button raised onclick="submitForm()">Submit</paper-button>
<script>
function submitForm() {
document.getElementById('insert-project-form').submit();
}
</script>
</form>
I have been having the same problem, and have been doing it the same way you do it. According to the Documentation it should work. But I have found a work around for this problem
Add a normal button for the submission and style its visibility to hidden
<button type="submit" id="SubmitButton" name="submit" style="visibility:hidden;"></button>
And in your javascript code change the submitForm function to this
function submitForm(){
document.getElementById('SubmitButton').click();
console.log("Submitted!")
}
And keep the paper button line the way it is.
<paper-button raised onclick="submitForm()">Submit</paper-button>
What it does is when the paper button is clicked, it triggers a click event on the normal submit. I'm pretty sure there are more efficient ways than this, but I will be using this for now.
<form is="iron-form" method="post" id="insert-project-form" action="/form/handler">
the attribute at the very end "action" needs to pass it to your php file. Assuming your php file is in a folder called "php". the solution to this would be
<form is="iron-form" method="post" id="insert-project-form" action="php/yourphpfile.php">
and your logic would be contained in the php file that submits it to a database if needed.
So I have this simple form:
<form action="includes/process.php" method="post" name="standard_use" id="standard_use" enctype="multipart/form-data">
<button onclick="dofunction(); return false;">Do it!</button>
<input type="file" id="upload_file" name="filename" style="float:left;width:70%;" size="42"/>
</form>
So what happens really when the button is clicked ?
Is it that the php file is called ? does it not ? the javascript is called before ?
Anyone can shed some light on this ?
Thanks !
Well, when you hit the button the following events occurs:
You send a REQUEST to the server
The php codes evaluates the request and runs some codes
Finally it returns back a RESPONSE which you see as a web page
Javascript is a client-side script which means that whenever you make an action on the page, the code runs. For instance, when you click the button, before sending the request javascript will work. You may, for instance, place a function that will be triggered when you hit the button which checks the form and either approves the form or shows the error messages
EDIT
As far as your comment is concerned:
Yes, javascript runs first when you hit the submit button. Php runs only when you submit the form and make a request to the server.
Consider this example: (I am better at explaining things with examples:)
<form action="somepage.php" onsubmit="return checkMe()" method="POST">
<input name="firstname" id="fn" value="" type="text" />
<input type="submit" value="Submit" />
<script type="text/javascript">
function checkMe(){
var tb = document.getElementById("fn")
if(tb.value == "Alex") return true;
else return false;
}
</script>
</form>
So basically, when you hit the button and try to submit the form, the javascript will first check whether the name provided in the textbox is Alex or not, if it is not then it will not submit the form. If it is Alex then it will submit the form and then the form will redirect the user to somepage.php. Finally, the php codes will work in somepage.php and the page will be rendered again.
What happens is that only doFunction() javascript function is invoked and nothing more.
However, it might be possible that this javascript function invokes "submit" event on the form and the request is sent (what you described as "php file is called").
Your code just trigger javascript event and your function. To submit a form you need an
<input type="submit" value="Submit" />
or a button, which default type is submit (thx davin)
<button value="Submit" />
However as far as you return false in your javascript code your form won't be submitted even with the submit button.
I have a main.php page
the following code is hardcoded in main form
<form action="test.php" method="POST">
the following is the code generated dynamically using AJAX
<input type="checkbox" value="test" name="test[]"/>
<input type="checkbox" value="test1" name="test[]"/>
<input type="submit" value="go">
ideally speaking on clicking the go button the page should submit to test.php page with the post value of the check elements
but now i find no action is taken by the browser. Also i find no error message in error console.
this used to work upto firefox 3.5 and IE 8. However in Firefox 3.6 the dynamically generated form elements are not recognized at all
Is there a mistake in the code and is a there a work around
Make sure that the dynamic content does not replace the form .. but gets appended to it (or replaces the contents and not the actual form tag..)