Submit form without submit button

JavaScript
1

I have a form where i use normal buttons with javascript so i can have multiple actions and I don’t use a submit button.

I can submit the form fine using document.adminform.submit(); but i have an onsubmit=“return submitForm”; attached to my <form> tag.

If i had a submit button, it would call the javascript function, but seeing as i don’t have a submit button, how can i call that function.

here is the bits causing problems

<form name="adminform" id="adminform" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>"  onsubmit="return submitForm();">

	<p><input type="button" class="back" id="backbutton" title="go back" onclick="performAction('back');" />
	<input type="button" class="save" id="savebutton" title="save" onclick="performAction('save');" /></p>

this is the javascript inside the form

function submitForm() {
	//make sure hidden and iframe values are in sync before submitting form
	//to sync only 1 rte, use updateRTE(rte)
	//to sync all rtes, use updateRTEs
	//updateRTE('rte1');
	updateRTEs();
	alert("rte1 = " + document.RTEDemo.rte1.value);
	
	//change the following line to true to submit form
	return true;
}

when the save button is clicked, a javascript function is called which does the document.adminform.submit(); but i need to do call the submitForm() function at the same time

2

Simply change your onClick action…


<input type="button" class="save" id="savebutton" title="save" onclick="if(submitForm())==true{performAction('save');}" /></p>
3

I tried that which makes sense but it won’t call that submitForm() function.

What it is supposed to do is submit a form which it does with submitFrom() but i need to get whatever is in the textarea (which is created using javascript) and post the data to another page using php (which is easy).

I can’t get whatever is in the textarea into a post variable

here is the page with my form

<?php
	function rteSafe($strText) {
		//returns safe code for preloading in the RTE
		$tmpString = $strText;
		
		//convert all types of single quotes
		$tmpString = str_replace(chr(145), chr(39), $tmpString);
		$tmpString = str_replace(chr(146), chr(39), $tmpString);
		$tmpString = str_replace("'", "'", $tmpString);
		
		//convert all types of double quotes
		$tmpString = str_replace(chr(147), chr(34), $tmpString);
		$tmpString = str_replace(chr(148), chr(34), $tmpString);
	//	$tmpString = str_replace("\\"", "\\"", $tmpString);
		
		//replace carriage returns & line feeds
		$tmpString = str_replace(chr(10), " ", $tmpString);
		$tmpString = str_replace(chr(13), " ", $tmpString);
		
		return $tmpString;
	}
	
	require_once('../php/database/MySQL.php');
	require_once('../php/database/connection.php');
	require_once('../php/init.php');
	require_once('php/script.php');

	$db = & new MySQL($host,$dbUser,$dbPass,$dbName);

    // The title of the page
    $title = "Edit a Service";
	
	if($_POST && array_key_exists("action", $_POST)) {

		// CARRY OUT RELAVANT ACTION
		switch($_POST['action']) {
			case "back":
				header('Location: services.php');
				break;
			case "save":
				header('Location: test.php');
				break;
		}
	}
    	
    // Include the header html
    require_once("header.inc.php");
	
	echo ( "<h1>Edit a Service</h1><hr />");

?>
<form name="adminform" id="adminform" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>"  onsubmit="return submitForm();">

	<p><input type="button" class="back" id="backbutton" title="go back" onclick="performAction('back');" />
	<input type="button" class="save" id="savebutton" title="save" onclick="if(submitForm())==true{performAction('save');}" /></p>
	
	<div id="formcontent">
		<fieldset class="form">
			<legend>Service</legend>
			<script type="text/javascript">
				<!--
				function submitForm() {
					//make sure hidden and iframe values are in sync before submitting form
					//to sync only 1 rte, use updateRTE(rte)
					//to sync all rtes, use updateRTEs
					//updateRTE('rte1');
					updateRTEs();
					alert("rte1 = " + document.RTEDemo.rte1.value);
					
					//change the following line to true to submit form
					return true;
				}
				
				//Usage: initRTE(imagesPath, includesPath, cssFile)
				initRTE("images/images/", "", "");
				//-->
				</script>
				<noscript><p><b>Javascript must be enabled to use this form.</b></p></noscript>
				
				<script type="text/javascript">
				
				<?php
				//format content for preloading
				if (!(isset($_POST["rte1"]))) {

					$content = "hdfsujfhsjkhfsdfsjk";
				} else {
					//retrieve posted value
					$content = rteSafe($_POST["rte1"]);
				}
				?>
				<!--
				//Usage: writeRichText(fieldname, html, width, height, buttons, readOnly)
				writeRichText('rte1', '<?php echo $content; ?>', 400, 200, true, false);
				
				//-->
			</script>
		</fieldset>		
		<input type="hidden" id="action" name="action"  value="" />
	</div>
</form>
<?php
    // Include the footer html
    require_once("footer.inc.php");
?>

and the function that is called when i click the button

function performAction(action) {
	// ASSIGN THE ACTION
	var action = action;
	
	// UPDATE THE HIDDEN FIELD
	document.getElementById("action").value = action;
	
	switch(action) {
		case "back":
			// SUBMIT THE FORM
			document.adminform.submit();
			break;
		case "save":
			// SUBMIT THE FORM
			document.adminform.submit();
			break;
                //and other actions here
        }
}
4

It would help enormously to see the source code for the form, as it appears on the web browser.

5

If I understand your question correctly, you’ll need to call the function yourself just before you submit the form:

if (submitForm()) {
    document.adminform.submit();
}
6

It seems to be submitting now but i still don’t think the submitForm() function is being called. When i click the “save” button it echoes out the default value instead of what is being typed in the textarea.

I got the text editor code from http://http://www.dynamicdrive.com/dynamicindex16/richtexteditor/index.htm and i know it works if i use a submit button.

I have added that little bit of code so it should call the function but it submits anyway without doing the alert which would tell me that it works.

Also, if i comment out $content = check_input(trim($_POST[‘rte1’]));, it doesn’t echo out anything so i guess the post value is not being sent somewhere.

I’ve attached the js in a text file if it helps

here is my page with the form

<?php

	require_once('../php/database/MySQL.php');
	require_once('../php/database/connection.php');
	require_once('../php/init.php');
	require_once('php/validators/ValidateEmpty.php');
	require_once('php/script.php');

	function rteSafe($strText) {
		//returns safe code for preloading in the RTE
		$tmpString = $strText;
		
		//convert all types of single quotes
		$tmpString = str_replace(chr(145), chr(39), $tmpString);
		$tmpString = str_replace(chr(146), chr(39), $tmpString);
		$tmpString = str_replace("'", "'", $tmpString);
		
		//convert all types of double quotes
		$tmpString = str_replace(chr(147), chr(34), $tmpString);
		$tmpString = str_replace(chr(148), chr(34), $tmpString);
	//	$tmpString = str_replace("\\"", "\\"", $tmpString);
		
		//replace carriage returns & line feeds
		$tmpString = str_replace(chr(10), " ", $tmpString);
		$tmpString = str_replace(chr(13), " ", $tmpString);
		
		return $tmpString;
	}	
	
	$db = & new MySQL($host,$dbUser,$dbPass,$dbName);

    /**
    * The home page of the website
    */
    // The title of the page
    $title = "Add a New Service";
	
	if($_POST && array_key_exists("action", $_POST)) {

		// CARRY OUT RELAVANT ACTION
		switch($_POST['action']) {
			case "back":
				header('Location: services.php');
				break;
			case "save":
				//variables for checking the user's name
				$content_title = check_input(trim($_POST['title']));
				$content = check_input(trim($_POST['rte1']));
				$page_title = check_input(trim($_POST['page_title']));
				$keywords = check_input(trim($_POST['keywords']));
				$desc = check_input(trim($_POST['desc']));
					
				break;
		}
	}
    	
    // Include the header html
    require_once("header.inc.php");
	
	echo ( "<h1>Add a New Service</h1><hr />");
	
	// If there was an error requesting a new password, display the error message.  Could be email address not found
    if (isset($insert_error)) {
		echo "There was an error: ".$insert_error;
    }
	
	if(isset($content)) echo $content;
?>
<form name="adminform" id="adminform" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>">

	<p><input type="button" class="back" id="backbutton" title="go back" onclick="performAction('back');" />
	<input type="button" class="save" id="savebutton" title="save" onclick="performAction('save');" /></p>
	
	<div id="formcontent">
		<fieldset>
			<legend>Page Content</legend>
			<h4>Please enter a title for the new service.</h4>
			<p><input class="form" type="text" title="Please enter a title for the general article" name="title" size="30"/></p>
			<br />
			<h4>Please enter the content for the new service.</h4>
			
			
			
			
			
			
			<script type="text/javascript">
			<!--
			function submitForm() {
				//make sure hidden and iframe values are in sync before submitting form
				//to sync only 1 rte, use updateRTE(rte)
				//to sync all rtes, use updateRTEs
				updateRTE('rte1');
				//updateRTEs();
				alert("rte1 = " + document.adminform.rte1.value);
				
				//change the following line to true to submit form
				return true;
			}
			
			//Usage: initRTE(imagesPath, includesPath, cssFile)
			initRTE("images/images/", "includes/", "");
			//-->
						
			<?php
			//format content for preloading
			if (!(isset($_POST["rte1"]))) {
				$content = "This is the preloaded content";
			} else {
				//retrieve posted value
				$content = rteSafe($_POST["rte1"]);
			}
			?>
			<!--
			//Usage: writeRichText(fieldname, html, width, height, buttons, readOnly)
			writeRichText('rte1', '<?php echo $content; ?>', 520, 200, true, false);
			
			//-->
			</script>
			
			
			
			
			
			
			
		</fieldset>
		<fieldset>
			<legend>Images</legend>
			<?php
				$max_imgs = 4;
				for($i=1; $i<=$max_imgs; $i++){
					echo '<p><input type="file" name="images[]" class="bginput" /></p>';
				}
			?>
		</fieldset>
		<fieldset>
			<legend>Page Information</legend>
			<h4>Please enter a title for the new page.</h4>
			<p><input class="form" type="text" title="Please enter a title for the general article" name="page_title" size="30"/></p>
			<h4>Please enter some keywords for the new page.</h4>
			<p><input class="form" type="text" title="Please enter a title for the general article" name="keywords" size="30"/></p>
			<h4>Please enter a description of the new page.</h4>
			<p><textarea style="height: 100px;width:400px;" class="form" title="Please enter the content for the general article" name="desc"></textarea></p>
		</fieldset>
		<input type="hidden" id="action" name="action"  value="" />
	</div>
</form>
<?php
    // Include the footer html
    require_once("footer.inc.php");
?>

and my function that is called when i click the save button

function performAction(action) {
	// ASSIGN THE ACTION
	var action = action;
	
	// UPDATE THE HIDDEN FIELD
	document.getElementById("action").value = action;
	
	switch(action) {
		case "back":
			// SUBMIT THE FORM
			document.adminform.submit();
			break;

		case "save":
			// SUBMIT THE FORM
			if (submitForm()) {
				document.adminform.submit();
			}
			break;
		default:
	}
}
7

I got this to work by moving the submitForm() function to the head of the page and it seemed to work.

I had to start from scratch adding bits and a time to see where it was going wrong and there was nothing wrong with any code but at least it works now :slight_smile: