On my page I have many forms, in witch field ids are generated based on DB id. like this:
<input type="hidden" name="id" value="<?php echo (isset($content))?$content->getId():''?>" />
<input type="hidden" id="x<?php echo $content->getId()?>"/>
<input type="hidden" id="y<?php echo $content->getId()?>"/>
<input type="hidden" id="x2<?php echo $content->getId()?>"/>
<input type="hidden" id="y2<?php echo $content->getId()?>"/>
That gives me unique ids for all forms.
Now I have Javascript function in jquery framework that sets vale of specified field that doesnt work:
$(function(){
$('#jcrop_target_id<?php echo $content->getId()?>').Jcrop({
onSelect: updateCoords
});
});
function updateCoords(c)
{
$('#x<?php echo $content->getId()?>').val(c.x);
$('#y<?php echo $content->getId()?>').val(c.y);
$('#x2<?php echo $content->getId()?>').val(c.x2);
$('#y2<?php echo $content->getId()?>').val(c.y2);
};
Values c.* are OK, but obviously #x<?php echo $content->getId()?> doesn't work.
What is the proper way to do it?
Regards.
Attempting to mix php and javascript can be pretty difficult. The reason for this is that they are not processed at the same time, or in the same way. PHP gets processed first on the server and the results of that process are sent to the browser. Then any javascript is processed.
Additionally, I don't think that php tags inside of javascript will actually be processed, but I'm not 100% certain about this.
One thing that you can do (but often looks pretty ugly) is to use php to actually create your javascript. For example:
echo '<script type="text/javascript">';
echo 'function updateCoords(c) {';
echo ' $(\'#x' . $content->getId() . '\').val(c.x);';
...
echo '}';
echo '</script>';
Like I said, it looks pretty ugly so I don't really recommend it, but it should actually work like you want.
I've always set the onChange event too. Does this help?
$('#jcrop_target_id<?php echo $content->getId()?>').Jcrop({
onSelect: updateCoords,
onChange: updateCoords
});
Related
problem
i have two button "YES" and "NO". if user click YES then text input will appear with value set ex: value="$check['sum'];" but when user click No then text input will appear without value ex: value ="".
here is my code
<input id="test<?php echo $row['br_loc'];?>" value="<?php echo $value;?>" name="test" type="text" class="test" style="width:70px;display:none">
and jquery
$(document).ready(function(){
$("#Yes<?php echo $row['br_loc'];?>").click(function(){
$("#test<?php echo $row['br_loc'];?>").show(1000);
});
$("#No<?php echo $row['br_loc'];?>").click(function(){
$("#test<?php echo $row['br_loc'];?>").hide(1000);
});
thanks you
Try using the disabled attribute:
$("#test<?php echo $row['br_loc'];?>").attr('disabled','disabled');
and
$("#test<?php echo $row['br_loc'];?>").removeAttr('disabled');
Try this:
$(document).ready(function(){
$("#YES").click(function(){
$("#test").show(); //value of input as set before. so, just show
}
$("#NO").click(function(){
$("#test").attr('value','').show(); //set value = '' , and show
}
});
Use binding function so that you provide your JS code with exact parameters. Code like yours should never be used.
Object ID or class should contain alphanumerical characters only, should not begin with number(s), and optionally, - or _ might be used. Avoid spaces or, as you've already shown yourself, using embedded PHP code which is highly unlikely to work in any further project of yours. It's also dangerous.
instead of this code $("#Yes<?php echo $row['br_loc'];?>")
try the following
$("#test<?php echo $row['br_loc'];?>").
Because you used id of button as "test<?php echo $row['br_loc'];?>". so only your click event not worked.
I have researched many places to find an answer to this question, but they never quite answer my real question: What is the best/approved way to move to a new page within the same website? I have read that it is bad to use window.location because search engines will think you are hiding something. But, when I don't want to open a new window (window.open), then I don't know how else to do it. I use href anchors in links and form actions, where appropriate. But when I have menus or buttons with onclick, then I need something else.
Here's an snippet of my code:
my javascript: (with one option commented)
function gotoCat() {
var catcdF = document.catSelect.catcd.value;
<?php
echo "window.location.href='http://www.mysite.org".$pgmdir."services/busMenu.php?catF='+catcdF; ";
/*
echo "window.open('http://www.mysite.org".$pgmdir."services/busMenu.php?catF='+catcdF,'','resizable=1,scrollbars=1,toolbar=1,top=50,left=300,width=950,height=800,location=0'); ";
*/
?>
}
My dynamic SELECT list in a form (within PHP):
echo " <select name='catcd' id='catcd' size='8' onclick=gotoCat() > \n";
// display list of categories
if ($numcats == 0) { // print message text only
echo "<option value='0' >".$catMsg."</option> \n";
}
else {
for ($i=1; $i<=$numcats; $i++) {
$catcd_db = $catAry[$i][1];
$catName_db = $catAry[$i][2];
echo "<option value='".$catcd_db."'> ".$catName_db." </option> \n";
}
}
echo "</select>";
So, as you can see, I just want a method to allow the user a choice and then automatically go to the correct web page once selected. This is not always in a select list. Often it's when they want to exit or get an error:
if (mysqli_connect_errno()) {
echo "<br/> <p style='text-align:center;'> <button type='button'
class='buttonStyle' style='padding: 4px 20px;' value='Exit' ";
echo "onClick=\"window.location.href='http://www.mysite.org/services/catSelbus.php?rc=1&func=Rev'\" > ";
echo "Exit </button></p> ";
}
I cannot use "go back" because they need to go to a prior page, not the form they came from.
So, unless my navigation methods are really off-the-mark, I guess I need to know the acceptable method for using javascript onClick to move to the next page in the same website. Is window.location okay, or should I use something else?
Any opinions or suggestions are welcome!
To navigate to another page using Javascript, use:
window.location.href = "url";
That's how it's done and there's nothing wrong about it.
For the sake of argument, you could create a hidden link and simulate a click on it, but as I said, there's really no need.
You can use php header('location') instead:
<form action="submit.php">
<input type="hidden" value="test" name="hidden1" />
<input type="submit" Value="Exit" ... />
submit.php
<?php
if (isset($_POST['hidden1'])
{
header('Location: http://www.mysite.org/services/catSelbus.php?rc=1&func=Rev');
exit;
}
?>
More info about header('Location ...');:
http://php.net/manual/en/function.header.php
Instead of a hidden, you use your select's value and get it via the $_POST variable.
I have a huge form and in part of the form I want to insert some value to database using js. I might not be clear about how to present the question but here my needs are:
suppose, I have two tables in database table1, table2. In a html form:
<select name="tab1" id="tab1">
<?php while($row = fetch from table 1){ ?>
<option value"<?=$row['name']?>" name="option1"><?=$row['name']?></option>
<?php } ?>
</select>
<input type="file" name="file">
<input type="button" name="button" onclick="submit_form(true,'');">
Now, I want to pass the $row['name'] value to submit_form() function in javascript. The javascript code will check the value and return it to the form to submit it. My question is since the $row['name'] from table1 is inside the while loop, I cannot pass the value to javascript. If the form was small I could have done using submit button and check $_POST('submit') type. I want to insert the $row['name'] in this form to table2 as file name associated with the name.
As i understand you want to pass selected value from form to submit_form() function?
function submit_form(param1, param2){
var passedValue = document.getElementById('tab1').value;
// here is your old submit_form() function. passedValue contains
// your selected $row['name']
}
#Jhilke Dai, First of all your php code is little buggy, '=' sign must be in html not in php the correct code is
<select name="tab1" id="tab1">
<?php while($row = fetch from table 1) { ?>
<option value="<? echo $row['name'] ?>" name="option1"><? echo $row['name'] ?></option>
<?php } ?>
</select>
<input type="file" name="file"> <input type="button" name="button" onclick="submit_form(true,'')">
You can use generic functions or even jQuery itenerations, to fetch form values
See the similar question answer : Get selected value/text from Select on change
function getDomValueByID( id ) {
return document.getElementById(id).value;
}
function submit_form( a, b ) {
var formValue = getDomValueByID( 'tab1' );
//OR
var jQueryFormValue = jQuery( "#tab1" ).val();
//Do what u want here.
}
In fact several consider it a very bad idea to pass the option data over via javaScript, if its already generated on page for the following reasons
Duplicate data, wasted bandwith.
Less portable code, non-OOP.
Harder to maintain, changes in your php code, requires changes in your javaScript code.
Also if you are really interested (this practice is sometimes frowned on). You can use the following as PHP code somewhere in the header. To pass PHP variables to JavaScript. However there are lots of better ways to do this, from JSONS to XML.
<?php optList = ['one', 'two', 'three']; ?>
<script type="text/javascript">
//Window represents the global variable space, and doing this is really bad practice as listed above.
window.optionList = [ <?php echo( implode(' , ', optList) );?> ];
</script>
Hi i want to get changed text value from JQuery but i can't select edit text with JQUERY because edit texts generated from php while loop that this php code query on database and get value of edit texts and in my program i have edit button for every edit texts and when the user changed value of edit text i select new value and when user click edit button send this value from get method to another php page with jquery $.ajax function and send new value to that php code with ajax.But i don't know how can i select edit text that it's value changed because i don't know id of that edit text!.And when i set one id for every edit text i only get first edit text value from $("#id").change().val();.I use below code but it doesn't work.I am beginner in java script and don't know how fix this problem!.
var testAnswer;
function setNewTestAnswer(id){
testAnswer = $("#id").val();
}
function sendToEdit(pID,phID,thDate,type){
var info = 'pId='+pID+'&phId='+phID+'&testAnswer='+testAnswer+'&thDate='+thDate+'&type='+type;
}
2nd function use testAnswer that user changed in edit text.
php code
<?php
include 'Connect.php';
if(match($_POST['pId'], "/^[\d]+$/") ){
$pId = $_POST['pId'];
$result = mysql_query("select pName, pID, phName, phID, testHistoryDate, type, testAnswer from patient join reception using(pID) join physician using(phID) join testHistory using(rID) join test using(tID) where pID = $pId",$connection);
}
else
die("Insert true value");
while($row=mysql_fetch_array($result)){
echo "<tr><td>";
echo $row["pName"].'</td>';
echo '<td>'.$row["phName"].'</td>';
echo '<td>'.$row["testHistoryDate"].'</td>';
echo '<td>'.$row["type"].'</td>';
$type = $row['type'];
$testHistoryDate = $row['testHistoryDate'];
?>
<td>
<span id='spryTanswer'>
<input type='text' name='tAnswer' id='tAnswer' value='<?php echo $row['testAnswer']; ?>' />
</span>
</td>
<td>
<input type='submit' value='Edit' name='edit' id='edit' onclick="sendToEdit('<?php echo $row['pID'] ?>','<?php echo $row['phID'] ?>', '<?php echo $row['testHistoryDate'] ?>', '<?php echo $row['type'] ?>')" />
</td>
</tr>
<?php } ?>
tl;dr
So it isn't completely clear what you are trying to do here but I can explain a couple things that might help.
in html ids should be unique. You dont have to obey this rule for your page to work but you have found one of the consequences if breaking it: jQuery will only find the first one.
it is a good idea to base html ids on some unique attribute of your data eg the table row id.
You can get more creative with your jQuery selectors for example
$('input[type="text"]') // gets all the text inputs
Use classes. When you want to be able to easily select all of a group of html elements you should give them all the same class name. one element can have multiple class names and many elements can share a class name. you can then select them by class name using jquery like this:
$('.myclassname')
I think you need to change your php to look more like this:
<span class='spryTanswer'>
<input type='text' name='tAnswer' id='tAnswer-<?php echo $row['id'] ?>' value='<?php echo $row['testAnswer']; ?>' />
</span>
Since you're creating elements inside a php loop, you must be sure that every element has a unique id (or no id at all). You can use either an incrementing index, or some unique value in your array. At first glance, seems that $row['pID'] is a good candidate:
<input id='edit_<?php $row['pID'] ?>' type='submit' value='Edit' ... />
After that you should be able to target individual elements.
how can I post back the data that are already in the text field?
example:
if I miss one of the required field an error will prompt when i click the submit button.
How can I make an post back data in that form using php or javascript and make the cursor of the mouse directly located to the field that caused an error?
There is no automated ways in PHP to write back the informations of the fields so you just have to echo it back.
Let's say you've got a "username" field ( <input type="text" name="username" /> ) you just need to add this:
value="<?php echo isset($_POST['username']) ? $_POST['username'] : ''; ?>"
or if you like more:
value="<?php if(isset($_POST['username'])) echo $_POST['username']; ?>"
changed "" to ''
This sounds like basic form validation. I would recommend reading some of these tutorials or looking for some pre-built PHP form validation mechanisms.
Form validation using PHP
PHP/CSS Form validation
PHP Form Validation
Some frameworks such as CodeIgniter will do this for you if you use their own libraries. It's worth checking out such a framework as they provide a lot of other benefits. Of course it's not always possible to transfer an existing application but it's still useful to bear in mind for the future.
If I understand this correctly you want to keep whatever data the user has already entered, tell him what he did wrong and preferably focus on the bad field.
If so then here's a very basic example using a form with two fields where both need to be filled in to proceed.
<?php
$field1=$_POST['field1'];
$field2=$_POST['field2'];
$badField="";
if($_POST['form_action']=="submitted") {
//Check incoming data
if(empty($field1)) {
$badField="field1";
echo 'field1 is empty<br>';
}
elseif(empty($field2)) {
$badField="field2";
echo 'field2 is empty<br>';
}
else { //Everything ok - move to next page
header('Location: <next page>');
}
}
echo '<form name="mybo" action="' . $_SERVER['PHP_SELF'] . '" method="POST">
<input type="text" name="field1" value="' . $field1 . '"><br>
<input type="text" name="field2" value="' . $field2 . '"><br>
<input type="submit" name="Submit" value=" Enter ">
<input type="hidden" name="form_action" value="submitted">
</form>';
//Focus on empty field
if(!empty($badField)) {
echo '<SCRIPT language="JavaScript">
document.mybo.' . $badField . '.focus(); </SCRIPT>';
}
?>
I think the Moav's answer is "philosophically" correct however if you want do that you can:
1) pass via GET or POST the text control id;
2) on the server check that error condition;
3) fill an hidden input field with that value on the page returns
4) if error that with JS you can do:
window.onload = init; // init stuff here
function init()
{
checkForError();
}
function checkForError()
{
var h = document.getElementById("error_field");
var v = h.value;
if(v)
document.getElementById(v).focus();
}
However, if you will do that for every error field there will be a post and this is
by a user perspective very boring...so it is better to adopt other approaches...
I would take a different approach:
Validation should be in JS, and as such you never loose data, as you don't submit.
Any wrong data that was submitted and caught on the server is due to someone trying to pass over your JS validation, which means he has criminal thoughts, usually.