charlie321 Posted March 31, 2019 Share Posted March 31, 2019 This may be off topic, I'm not sure but it is basically about a page I am working with that is primarily php. There is some html form in it. I originally thought I was going to do onsubmit and that it was php, but now I realize that it is actually script. This php page passes to another page based on a drop down selection box and a text box in form. I am trying to figure out a way to prevent the user from going to the next page if they do not do anything with either the drop down box or the text box and just hit submit. Giving an alert then staying on the same page and allowing them to try again. I have been trying to get this to work all day but I have very little experience in script and am having no luck at all. I am trying to give the top option value "" and the text box should be null or "" also. This is the code that is mainly involved. Does anyone have a clue what I should do? I script something that would work or could I do this with php instead. I have found that php only reacts to action, not onsubmit. Well any help would be appreciated. <script> function myFunction(){ if (mfg = ""......... alert("Please pick a category or text!") window.history.back(); } </script> </HEAD> <BODY> <DIV id="header"></DIV> <form target="_blank" method="POST" action="/mgrid.php" onsubmit="myFunction()"> <td><select name="mfg" style = "height: 30; font-size: 14;"> <!--<option value="">Select a category and/or use the text box below. Select Test Search Only to search from text box only</option>--> <option value="">Select a category</option> Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 31, 2019 Share Posted March 31, 2019 I would move the onsubmit to a submit button element (or whatever is actually triggering it) and use a "return xxxxx" format so that it cause the submit action to fail if your function doesn't like something. Your style may work but not being familiar with using the onsubmit at the form level instead of the type=submit level I have to work with what I (think) I know. The format of that call would be : <input type='submit' name=xxx onclick='return myfunction()'> where your function has to return either a true or false value in order to cause to to work properly. Of course you can use the function to display any error messages generated, using a hidden ( or unused) text area (or span) for showing any messages. Have fun! Ps - you might want to learn how to do your design stuff (ie, 'css') using actual CSS code rather than doing it inline on each and every element that you want to stylize. Quote Link to comment Share on other sites More sharing options...
Barand Posted March 31, 2019 Share Posted March 31, 2019 7 hours ago, ginerjm said: I would move the onsubmit to a submit button element ... and pray that the user doesn't hit the Enter button while in the text box to submit the form Quote Link to comment Share on other sites More sharing options...
Barand Posted March 31, 2019 Share Posted March 31, 2019 try something like this example <script type="text/javascript"> function myFunction(myform) { return myform.selA.value != '' || myform.textB.value != '' } </script> <form action="" onsubmit="return myFunction(this)"> <select name='selA'><option value=''>- select -</option><option>AAAAAAAA</option><option>BBBBBBBBB</option></select> <input type="text" name="textB"> <input type="submit" name="btnSub" value="Submit"> </form> Quote Link to comment Share on other sites More sharing options...
charlie321 Posted March 31, 2019 Author Share Posted March 31, 2019 Thanks for the suggestions. I never did get this done with script but decided to finish this on the passing page if both boxes were empty. The problem I found was that I was not able to get the if statement working in script. I tried this more than a different variations: <script type="text/javascript"> function myFunction() { if (var mfg.value == '"'){ alert("Please make a selection!"); return false; } } </script> It just acted as if mfg and txt did not exist even though both were null. The way I ended up doing it though was actually better as I did it based on the number of results. This way I could control people who might have been trying to get in from outside the script and look at my entire table. As far as css, etc. I do use that. The problem I had with this site was that through Java script I use a header, body, and footer together. I could never figure out how to separate them. But I think I just figured that out in that you would have a different css file for each one of them. In theory I hope that will solve my problem. I'd still love to figure out the java problem, but had to move past this problem.... Quote Link to comment Share on other sites More sharing options...
charlie321 Posted April 1, 2019 Author Share Posted April 1, 2019 Solution: <script type="text/javascript"> function myFunction() { if(document.getElementById('seleid').value == "" && (document.getElementById('txt').value).length==0) { alert("Please make a selection in the category box or search box or both!"); return false; } } </script> where id for drop down form box is "" and id for text box is txt. Works very well!!! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.