Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Jun 2010
    Location
    Earth
    Posts
    305
    Thanks
    27
    Thanked 2 Times in 2 Posts

    submitting a form

    I am trying to set up a simple rich text editor and have run into a problem I need help resolving

    I have the form all set and am using this to send the data
    Code:
    <input name='submitPhoto' type='button' value='Submit Data' onClick=\"javascript:submit_form();\"/>
    My problem is everything runs and I don't want some things to run unless the form has been submitted. Now with my straight php pages I use the
    PHP Code:
    if( isset($_POST['submitPhoto'])) { 
    But can't get that to work with the Javascript, can someone help me out??

    Full code::
    Code:
    <?php 
    	// CONNECTION TO DATABASE	
    
    // I do not want anything above the HTML to process until necessary
    	
    
    	$thread = 1;
    	$message = $_POST['message'];
    	$author = 'kelly';
    	$posted = date(" F j, Y g:i a",$r[posted]);
    	$imageName = $_FILES['photo_1']['name'];
    	
    	$stmt = $mysqli->prepare("INSERT INTO testTable VALUES(NULL,?,?,?,?,?)");
    	$stmt->bind_param('issss',
    		$thread,
    		$message,
    		$author,
    		$posted,
    		$imageName);
    	$stmt->execute();
    		
    	$target_path = "messageImage/";
    
    	$target_path = $target_path . basename( $_FILES['photo_1']['name']); 
    
    
    	if(move_uploaded_file($_FILES['photo_1']['tmp_name'], $target_path)) {
    
    		echo "The file ".basename( $_FILES['photo_1']['name'])." has been uploaded	";
    	} 
    	else{
    		echo "There was an error uploading the file, please try again!";
    	}
    
    
    	echo "
    	<html>
    		<head>
    			<link rel='stylesheet' type='text/css' href='smallColorPicker.css'>
    			<meta http-Equiv='Content-Type' content='text/html; utf-8'> 
    			<script type=\"text/javascript\" src=\"wysiwyg/wysiwyg.js\"></script>
    
    			<style type=\"text/css\">
    				#form div select.selectOne, select.selectsex, input.zip {
    						padding: 1px 3px;
    						font-size: 11px;
    						font-family: Verdana;
    						font-weight: lighter;
    						color: 393325; 
    				}
    			</style>
    
    		</head>
    		
    		<body onLoad=\"iFrameOn();\"> ";
    			$result = $mysqli->query("SELECT * FROM testTable "); 
    
    			while ($r = $result->fetch_assoc()) {
    				$message2=$r["message"];	
    				$author2=$r["author"];
    				$image =$r["image"];
    			
    				$save_path = "messageImage/";
    				$image= $save_path . $image;
    				echo "<h2>You posted:</h2> $message2, $author2 <hr /> <br><img src='$image'>";
    			}
    	
    		echo "
    
    		<form enctype='multipart/form-data' action='' method='POST' name='myform' id='myform'>
    			<p>
    				<div id=\"wysiwyg_cp\" style=\"padding:8px; width:700px;\">
    					<input type=\"button\" onClick=\"iBold()\" value=\"Bold\" class='zip'> 
    					<input type=\"button\" onClick=\"iUnderline()\" value=\"Underline\" class='zip'>
    					<input type=\"button\" onClick=\"iItalic()\" value=\"Italic\" class='zip'>
    					<input type=\"button\" onClick=\"iFontSize()\" value=\"Size\" class='zip'>
    					<input type=\"button\" onClick=\"iForeColor()\" value=\"Color\" class='zip'>
    					<!-- http://www.w3schools.com/jsref/jsref_fontcolor.asp -->
    					<input type=\"button\" onClick=\"iLink()\" value=\"Link\" class='zip'>
    					<input type='file' name='photo_1' class='zip'>
    						
    					<!-- <input id='sd1' class='color_picker' value='' /> -->
    				</div>
    
    				<!-- Hide(but keep)your normal textarea and place in the iFrame replacement for it -->
    
    				<textarea style='display:none;' name='message' id='message' cols='100' rows='14'></textarea>
    
    				<iframe name='richTextField' id='richTextField' style='border:#000000 1px solid; width:700px; height:300px;'></iframe>
    
    				<!-- End replacing your normal textarea -->
    
    			</p>
    			<br /><br />
    			<input name='submitPhoto' type='button' value='Submit Data' onClick=\"javascript:submit_form();\"/>
    
    		</form>
    	</body></html> ";
    ?>

  • #2
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,899
    Thanks
    15
    Thanked 226 Times in 226 Posts
    A way that I have used, and works very well is to put hidden inputs in the form, and outside of the form have a 'dummy' form which works with javascript. As you fill out the JS 'form' it exports the data to the hidden inputs in the real form. You can have a button which runs a JS function which validates the form. And put a real submit button on the real form.

    Code:
    <input type="submit" name="submitPhoto" value="Submit Photo">
    And don't use the submit input for the isset statement, use one of the hidden ones.

  • #3
    Regular Coder
    Join Date
    Jun 2010
    Location
    Earth
    Posts
    305
    Thanks
    27
    Thanked 2 Times in 2 Posts
    Thanks! I had just figured that out LOL

  • #4
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,899
    Thanks
    15
    Thanked 226 Times in 226 Posts
    BTW, as far as I can tell the form submits onmouseup, so if you have a JS function that needs to run before the form submits, run it onmousedown.

  • #5
    Regular Coder
    Join Date
    Jun 2010
    Location
    Earth
    Posts
    305
    Thanks
    27
    Thanked 2 Times in 2 Posts
    I don't believe it does, not very familiar with js so I am on some uncharted ground for myself

  • #6
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    3,763
    Thanks
    23
    Thanked 548 Times in 547 Posts
    While you guys were talking I separated the php from the html, added a doctype and hidden field, did a if/else on the php, and then added it to the top of the html.
    This should work, but of course we didn't see the js.
    Code:
    <?php
    // will execute the DB insert when form submitted or the DB read will
    //  <input type="hidden" name="Msoft" value="junk">
    if($_POST['Msoft']  == "junk"){
    	$thread = 1;
    	$message = $_POST['message'];
    	$author = 'kelly';
    	$posted = date(" F j, Y g:i a",$r[posted]);
    	$imageName = $_FILES['photo_1']['name'];
    
    	$stmt = $mysqli->prepare("INSERT INTO testTable VALUES(NULL,?,?,?,?,?)");
    	$stmt->bind_param('issss',
    	$thread,
    	$message,
    	$author,
    	$posted,
    	$imageName);
    
    	$stmt->execute();
    	$target_path = "messageImage/";
    	$target_path = $target_path . basename( $_FILES['photo_1']['name']);
    }else{
    	$result = $mysqli->query("SELECT * FROM testTable ");
    	while ($r = $result->fetch_assoc()) {
    		$message2=$r["message"];
    		$author2=$r["author"];
    		$image =$r["image"];
    		$save_path = "messageImage/";
    		$image= $save_path . $image;
    		echo "<h2>You posted:</h2> $message2, $author2 <hr /> <br><img src='$image'>";
    	}
    }
    ?>
    <!DOCTYPE html>
    <html>
    <head>
    <link rel='stylesheet' type='text/css' href='smallColorPicker.css'>
    <meta http-Equiv='Content-Type' content='text/html; utf-8'>
    <script type=\"text/javascript\" src=\"wysiwyg/wysiwyg.js\"></script>
    <style type=\"text/css\">
    #form div select.selectOne, select.selectsex, input.zip {
    padding: 1px 3px;
    font-size: 11px;
    font-family: Verdana;
    font-weight: lighter;
    color: 393325;
    }
    </style>
    </head>
    
    <body onLoad="iFrameOn();">
    <form enctype='multipart/form-data' action='' method='POST' name='myform' id='myform'>
    <input type="hidden" name="Msoft" value="junk">
    <p>
    <div id="wysiwyg_cp" style="padding:8px; width:700px;">
    <input type="button" onClick="iBold()" value="Bold" class='zip'>
    <input type="button" onClick="iUnderline()" value="Underline" class='zip'>
    <input type="button" onClick="iItalic()" value="Italic" class='zip'>
    <input type="button" onClick="iFontSize()" value="Size" class='zip'>
    <input type="button" onClick="iForeColor()" value="Color" class='zip'>
    <!-- http://www.w3schools.com/jsref/jsref_fontcolor.asp -->
    <input type="button" onClick="iLink()" value="Link" class='zip'>
    <input type='file' name='photo_1' class='zip'>
    <!-- <input id='sd1' class='color_picker' value='' /> -->
    </div>
    <!-- Hide(but keep)your normal textarea and place in the iFrame replacement for it -->
    <textarea style='display:none;' name='message' id='message' cols='100' rows='14'></textarea>
    <iframe name='richTextField' id='richTextField' style='border:#000000 1px solid; width:700px; height:300px;'></iframe>
    <!-- End replacing your normal textarea -->
    </p>
    <br /><br />
    <input name='submitPhoto' type='button' value='Submit Data' onClick="javascript:submit_form();"/>
    </form>
    </body>
    </html>
    Evolution - The non-random survival of random variants.

  • Users who have thanked sunfighter for this post:

    harkly (05-29-2013)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •