I'm currently re-designing a page on my site that allows registered users to send messages to the administrators. All the code I'm using is already fully functional on the other page but after moving everything across, it has stopped working, which has baffled me.
<textarea name="content" id="msgs" class="convo" ></textarea>
The text area is as simple as it gets, the form is wrapped around TR tags.
I know the form is working because I also submit to the form the date/time and the email address' of the sender and receiver. The form executes 'compose.php', writes to the database successfully and re-directs back to the customer's profile. The problem is that the "new" message is blank. Everything was sent to the form apart from the contents of the text area.
If I use a plain text area then everything works, so the problem has to be the 'WYSIWYG Content Editor' that I apply to the text area, even though it works fine on the other page?
bkLib.onDomLoaded
(
function()
{
new nicEditor({buttonList : ['bold','italic','underline','left','center','right','ol','ul','fontFamily','fontSize','fore color','link','unlink']}).panelInstance('msgs');
}
);
Does anyone have any idea where I can start? I've been troubleshooting this for a good few hours and it's starting to get the best of me! If you need any other snippets of code, let me know.
EDIT
Maybe this will help...
<textarea name="content" id="msgs" class="convo" >TEST MESSAGE</textarea>
When the page loads, "TEST MESSAGE" is written to the text area. If I submit it, the value is passed to the form and then to the database etc... But if I remove it and type my own words, nothing is sent across?
I have managed to fix the problem!
The old code was:
<form name="send" id="sndmsg" method="post" action="compose.php">
<tr>
<td width="90%" class="tab"> Compose New Message</td>
</tr>
<tr>
<td>
<textarea name="content" id="msgs" class="convo" ></textarea>
</td>
</tr>
<tr>
<td>
<input name="user_s" type="hidden" id="user_s" value="<?PHP echo $user;?>" />
<input name="user_r" type="hidden" id="user_r" value="<?PHP echo $email;?>" />
<input name="fname" type="hidden" value="<?PHP echo $fullname;?>" />
<input type="image" src="/send.png" />
</td>
</tr>
</form>
Which was clearly, not working. The new code does work, which is the following:
<tr>
<td width="90%" class="tab"> Compose New Message</td>
<form name="send" id="sndmsg" method="post" action="compose.php">
<textarea name="content" id="msgs" class="convo" ></textarea>
<input name="user_s" type="hidden" id="user_s" value="<?PHP echo $user;?>" />
<input name="user_r" type="hidden" id="user_r" value="<?PHP echo $email;?>" />
<input name="fname" type="hidden" value="<?PHP echo $fullname;?>" />
<input type="image" src="/send.png" />
</form>
</td>
</tr>
Related
I am try to display under my form the new value.
<form>
<h2>AES Encryption</h2>
<table>
<tr>
<td>
<label for="inputValue">Text to encrypt</label>
</td>
<td>
<input type="text" id="inputValue" size="50" name="inputValue" />
</td>
</tr>
<tr>
<td>
<label for="inputPassword">Password:</label>
</td>
<td>
<input type="text" id="inputPassword" size="50" name="inputPassword" />
</td>
</tr>
<tr>
<td>
<input type="submit" value="Verschlüsseln" id="submitButton" onclick="encryptAES()"/>
</td>
</tr>
</table>
<div id="afterPressed" hidden="true">
<h3 id="resultTitle"></h3>
<p id="result"></p>
<br>
<h3>Code</h3>
Download
</div>
</form>
and my Script:
function encryptAES() {
var value = document.getElementById("inputValue").value;
var password = document.getElementById("inputPassword").value;
var encrypted = base64toHEX(CryptoJS.AES.encrypt(value, password));
document.getElementById("afterPressed").removeAttribute("hidden");
document.getElementById("resultTitle").innerHTML = "Result";
document.getElementById("result").innerHTML = encrypted;
}
When I click the button the code works for 1 second and then refresh the form as null
I want to show the result in the div result tag, but the page is updated and everything disappears and the code is hidden again.
Your form is submitting, so the values are displayed in the browser and then the page reloads.
You can either set the onsubmit property of the form like this:
<form onsubmit="return false;">
Or you can use an <input type="button"> or <button> instead of the <input type="submit"> that is... well, submitting the form.
Update your form tag with <form onsubmit="return false;">. This will prevent the page from getting submitted.
Working on a really simple form for a district site. I have a really simple form in PHP.
<form method="post">
<fieldset>
<legend>Enter Age and Weight</legend>
<label>Age:</label>
<input type="text" name="age" value="<?php echo #$_POST['age'] ?>">
<label>weight:</label>
<input type="text" name="weight">
<div>
<button class="btn" type="submit" name="action" value="enter">Enter</button>
</div>
</fieldset>
</form>
What I am trying to do is when the user presses the enter button, I want to alert the user of what they have entered.
This is what I have so far in my HTML.
<body onload="document.forms[0].submit()">
<form action="/index.php" onsubmit="" method="POST">
<script>
alert(document.getElementsByName("age").value);
</script>
</form>
</body>
However, I keep seeing "undefined". I am assuming that is happening because on page load my script is being run instead of when the user presses the submit button. Kind of confused how to just do a simple alert. Appreciate any help.
You must insert your code in a function that you must attach to a event handler like onsubmit, something like this:
HTML:
<form method="post" onsubmit="showData();">
JAVASCRIPT:
function showData() {
alert(document.getElementsByName("age")[0].value);
}
I've inserted [0] in your Javascript code because document.getElementsByName returns you an Array of elements, in your case, this Array, obviously contains only one value that is retrievable on the index 0 (first index of any array).
<form method="post" id="myform">
<fieldset>
<legend>Enter Age and Weight</legend>
<label>Age:</label>
<input type="text" name="age" value="<?php echo #$_POST['age'] ?>" id="age">
<label>weight:</label>
<input type="text" name="weight">
<div>
<button class="btn" type="button" name="action" value="enter" onclick="alert(document.getElementById('age').value);document.getElementById('myform').submit()">Enter</button>
</div>
</fieldset>
</form>
Is this what you want?
I have some problem with a form which contains foreach and I input submit button outside of form (out of foreach) but when i select checkboxes, it get only first checkbox!!! how it can be done ? Thanks
Remarque: I can't put the form around foreach.
{foreach from=$aWSForServer2 key=ws item=webservice}
<form action="index.php" method="post" onSubmit="return confirm('{$i18n.confirm_suppress}')" id="FormDelSelWS" >
<input type="hidden" name="view_mode" value="{$view_mode}" />
<input type="hidden" name="action" value="del_sel_ws" />
<input type="hidden" name="idServer" value="{$server_id}" />
<input type="checkbox" name="WSSelcet[]" value="{$webservice.Webservice__}" />
</form>
{/foreach}
<table style="width:620px;margin:5px;">
<tr>
<td style="width:300px"></td>
<td style="width:140px"></td>
<td style="width:160px"></td>
<td>
<button type="submit" value="{$i18n.suppress}" form="FormDelSelWS">
supprimer</button>
</td>
</tr>
</table>
A form control cannot be associated with multiple forms
An ID must be unique in a document (so you can't generate multiple forms with the same ID in a loop).
You need to rethink your logic, probably to include a single form.
It isn't clear which of the values changes in your loop, but it looks like only the checkbox does. If so, you just need to move your loop inside the form.
<form action="index.php" method="post" onSubmit="return confirm('{$i18n.confirm_suppress}')">
<input type="hidden" name="view_mode" value="{$view_mode}" />
<input type="hidden" name="action" value="del_sel_ws" />
<input type="hidden" name="idServer" value="{$server_id}" />
{foreach from=$aWSForServer2 key=ws item=webservice}
<input type="checkbox" name="WSSelcet[]" value="{$webservice.Webservice__}" />
{/foreach}
<button type="submit" value="{$i18n.suppress}">
supprimer
</button>
If any of the other values change in your loop, and need to be associated with a particular submit button then you can either:
Just keep them on the server and look them up with the checkbox values
Encode them in the form associated with the checkbox name (and then look them up on the server, but in $_POST.
Such:
<input type="hidden" name="idServer[{$webservice.Webservice__}]" value="{$server_id}" />
I have a demo-employee.php page that retrieves all the users of the system alongside specific actions that can be performed:
<td><table>
<tr>
<td><i class="fa fa-pencil-square-o"></i></td>
<td></i></td>**
<td><i class="fa fa-trash-o"></i></td>
</tr>
</table>
</td>**
I am using data-featherlight to pop up the page demo-change-passowrd.php, upon clicking the link the user gets this form:
<form id="changePwd" name="formPwd" method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" accept-charset="UTF-8">
<p>Please fill all the mandatory (*) fields.</p>
<div class="question">
<input type="password" name="new_pwd" pattern="^.*(?=.{6,})(?=.*[a-zA-Z])[a-zA-Z0-9]+$" title="Your new Password is required" required/>
<label><?php echo "<font color='red'>New Password(*):</font>" ?></label>
</div>
<div class="question">
<input type="password" name="confirm_pwd" pattern="^.*(?=.{6,})(?=.*[a-zA-Z])[a-zA-Z0-9]+$" title="Confirm Password field is required" required/>
<label><?php echo "<font color='red'>Confirm Password(*):</font>" ?></label>
<span class="required" id="doesNotMatch"></span>
</div>
<center>
<input type="submit" name="submit" onclick="checkPwdMatch();" onsubmit="return closeSelf(this);" value="Submit" />
<input type="hidden" name="user_id" id="user_id" value="<?php echo $user_id; ?>" />
</center>
</form>
I have a method to check if the pwdmatches, and upon successfully submitting the form, it should close with this method which is appended # the bottom of the page
function closeSelf(f){
f.submit()
window.close();
}
Also I moved this from the button to the form onsubmit="return closeSelf(this);", still no luck. Upon submitting the form, it just stays on the demo-change-passowrd.php. I also used window.location.replace to the demo-employeed page instead of window.close(), no luck as well. Can someone help please, I did
$("#myform").submit(function(e) {
//prevent Default functionality
e.preventDefault();
window.close();
Still no luck? am I missing something please?
I added an onsubmit attribute to form that would call 'click' on the close button (which has the class featherlight-close).
<form ... onsubmit="$('.featherlight-close').click()">
I'm working on a website that includes Facebox to load content for a basket process.
When adding something to the basket and clicking the green wishlist button I'm having trouble with it loading in IE8, it works on all the modern browsers. Can anyone see why it won't load content in IE8 in the facebox?
I'm using this code on the wishlist button:
<div onclick="location.href='wishlist.php?basket=true'" rel="msgbox" id="mybasket">
Is it enough info to view source on the link to the site? If you need any more code then please ask.
On a Mac using Chrome - as you can see the facebox has opened fine when clicking on the green wishlist button.
On a PC using IE8 - when clicking on the green wishlist button the facebox opens but doesn't load the content.
This is a problem with the returned data, You have an extra </div> at the end.
<div id="msgbox_title">Your Wish List<div id="closeme" onclick="jQuery(document).trigger('close.facebox')">x</div></div>
<form method="post" action="wishlist.php">
<div id="msgbox_body" style="max-height:400px;min-height:100px;overflow-y:auto;overflow-x:hidden;">
<input type="hidden" name="updatebasket" value="1" />
<table border="0" cellpadding="0" cellspacing="5" align="center" style="min-width:390px;border-collapse:separate!IMPORTANT;">
<tr><td colspan="5" style="text-align: left;"><strong style="font-size:14px;">Rotunda Vulsellum Forceps</strong></td></tr> <tr>
<td style="width: 50px;"><span style="color: #aaa;">Quote:</span></td>
<td style="width: 50px;"><span style="color: #aaa;">Sample:</span></td>
<td style="width: 350px;"><span style="color: #aaa;">Description:</span></td>
<td style="width: 80px;"><span style="color: #aaa;">Pack size:</span></td>
<td style="width: 40px;"><span style="color: #aaa;">Remove</span></td>
</tr>
<tr>
<!-- <td style="padding:0px 2px;"><input type="textbox" class="textbox" value="3" name="54_59_131" /></td> -->
<td align="center" valign="middle" style="background-color:#C3DCCD;"><input checked="checked" style="margin:5px;" type="checkbox" name="products-quote[]" value="835" /></td>
<td align="center" valign="middle" style="background-color:#D3C4DF;"><input checked="checked" style="margin:5px;" type="checkbox" name="products-sample[]" value="835" /></td>
<td style="font-size:11px;background-color:#efefef;"><p style="margin:0px 0px 5px 0px;padding:5px;"><span style="color:#663399;font-weight:bold;">VFR1001</span> Sterile Single-use Rotunda Vulsellum Forceps, double packed</p></td>
<td style="font-size:11px;background-color:#efefef;"><p style="margin:0px 0px 5px 0px;padding:5px; font-weight:bold;">10 units</p></td>
<td align="center"><b>X</b></td>
</tr>
</table>
</div>
<script>
function quoteme() {
$("#msgbox_body").html('<div id="contactform" style="margin-left:20px;margin-right:20px;margin-top:10px;"><form class="form" method="POST" action="http://www.dtrmedical.com"><table border="0"><tbody><tr><td><p class="name"><label for="name">Your Name<span style="color:red;">*</span>:</label></p></td><td> </td><td><input type="text" name="name" id="name" /></td></tr><tr><td><p class="hospital"><label for="hospital">Hospital/Institution:</label></p></td><td> </td><td><input type="text" name="hospital" id="hospital" /></td></tr><tr><td><p class="department"><label for="department">Department:</label></p></td><td> </td><td><input type="text" name="department" id="department" /></td></tr><tr><td><p class="email"><label for="email">E-mail<span style="color:red;">*</span>:</label></p></td><td> </td><td><input type="text" name="email" id="email" /></td></tr><tr><td><p class="tel"><label for="tel">Telephone<span style="color:red;">*</span>:</label></p></td><td> </td><td><input type="text" name="tel" id="tel" /></td></tr><tr><td colspan="3" align="center"><p class="submit"><input style=\"margin-left:27px;cursor:pointer;\" onclick="jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&email=\' + this.form.email.value + \'&tel=\' + this.form.tel.value + \'&hospital=\' + this.form.hospital.value + \'&department=\' + this.form.department.value) }); return false;" type="submit" value="Send enquiry" name="submit" /></p></td><td> </td><td> </td></tr></tbody></table></form></div>');
$("#msgbox_actions").html('<input onclick="jQuery.facebox({ ajax: \'wishlist.php?basket=true\' })" type="button" value="Back to Wishlist" />');
}
</script>
<div id="msgbox_actions"><input onclick="quoteme()" type="button" value="Request quote/sample" /> <a class="backtoproducts" href="http://www.dtrmedical.com/products" style="border-bottom-left-radius:5px 5px;border-bottom-right-radius:5px 5px;border-bottom-style:none;border-color:initial;border-left-style:none;border-right-style:none;border-top-left-radius:5px 5px;border-top-right-radius:5px 5px;border-top-style:none;border-width:initial;color:white;font-family:Arial;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;font-size:11px;">Back to products</a></div><!-- <input type="submit" value="Update" /> --><!-- <input onclick="jQuery.facebox({ ajax: 'wishlist.php?emailme=true' })" type="button" value="Save list for later" /> --> <!-- <input type="submit" value="Update Qty's" /> <input onclick="jQuery.facebox({ ajax: 'wishlist.php?basket=true&clearall=true' })" type="button" value="Clear list" /> --></div>
</form>
In the line of starting with <div id="msgbox_actions">, at the end of it after the comments, is the extra </div>
This is breaking your html, which IE doesn't know how to fix, yet other browsers are able to.
Probably not the problem but my FireBug console tells me this when I click on the button:
"NetworkError: 404 Not Found - http://dtrmedical.com/xfade2.css"
It is not finding your CSS file for some reason or another.
Your onclick event isn't binding properly to your shopping cart div. I'm not sure why, exactly; IE8 may be buggy about parsing complicated HTML attributes like that properly.
Instead of defining the event inline (right inside of the HTML tag), try doing it via jQuery, instead. Add the following code to the beginning of your $.ready body.
$('#mybasket').click(function(){location.href='wishlist.php?basket=true';});
As a side note, you should always avoid defining any event handling in your HTML, instead taking the approach I describe above. Doing so not only means that all of your "action" code will be in once place, but it also affords you greater cross-browser support (especially when you leverage a library like jQuery).