Javascript fill html input form - javascript

I have a generated list of Buttons:
<?php
echo "<td> <button id=\"{$cell}\" onclick=\"ausfüllen($cell)\">{$cell}</button></td>"
?>
and I want to call a JavaScript function:
<script>
function ausfüllen(text) {
document.getElementById("nv_durchwahl").value = "dw";
}
</script>
to fill out some other <td>:
<td>
<input type="text" id="nv_durchwahl" name="nv_durchwahl" value="">
</td>
This is how i tried it.
The buttons are generated without any problem but it doesn't fill out the form.
Any ideas where I went off in this one?

You forgot to close the function bracket
<script>
function ausfüllen(text) {
document.getElementById("nv_durchwahl").value = "dw";
}
</script>
And there is no element with ID "nv_durchwahl".

try to concatenate this way... the function ausfüllen receives a string, check how is being translated into html code...
<?php
echo "<td> <button id='".{$cell}."' onclick='ausfüllen(".'"'.{$cell}.'"'.")'>".{$cell}."</button></td>";
?>
when you say
fill out the form.
means putting on the element with id "nv_durchwahl" (which should be unique) the value "dw" or the content of "text" variable?
<script>
function ausfüllen(text) {
//set the value of the element with the specific id to "dw"
//text is never used!
document.getElementById("nv_durchwahl").value = "dw";
}
</script>

Related

How to call a function in a php file using jquery load?

I am trying to display the data i retrieve from the database but it is not being displayed. I have a function in the file getComments.php called "getComments(page)" page is just a integer parameter to choose that database. and as you can see that i need to call this function to print the users comments. I am trying to use "load" but it is not being successful i just want to call this function to load the comments on the page. thank you in advance.
<?php
use TastyRecipes\Controller\SessionManager;
use TastyRecipes\Util\Util;
require_once '../../classes/TastyRecipes/Util/Util.php';
Util::init();
function getComments($page){
echo "<br><br>";
$controller = SessionManager::getController();
$controller->getComments($page);
SessionManager::setController($controller);
}
and in my web page where i want to display it using java script, i tried the following
<div class="page" id="comments">
<p class="style">Comments</p>
<button class="btn" id="load-comments">See Previous Comments</button><br>
<br><br>
<?php
if(isset($_SESSION['u_id'])){
echo " <input type='hidden' id='uid' value = '".$_SESSION['u_uid']."'>
<input type='hidden' id='date' value = '".date('Y-m-d H:i:s')."'>
<textarea id='message'></textarea><br>
<button class = 'btn' type = 'submit' id = 'submitCom'>Comment</button>";
}
else{
echo "<p>Please log in to comment</p>";
}
?>
</div><br>
<script>
$(document).ready(function(){
$("#load-comments").click(function(){
document.getElementById('#comments').innerHTML =
$("#comments").load("../extras/getComments.php", getComments(1));
});
});
</script>
Just change your click handler to this:
$("#load-comments").click(function(){
$("#comments").load("../extras/getComments.php", { page: 1 }); //i also added where the elements are loaded
});
and in getComments.php (if practical, otherwise you might need to create a new PHP file which calls the getComments() function and call that from the click handler instead) add something like:
if (isset($_POST['page'])) {
getComments($_POST['page']);
// do any other necessary stuff
exit;
}

HTML text input conditional submit

I have a page that loads a random MP3 file on each refresh. The user has to guess a name based on the sound via text form input. I want to check their input against the stored string and refresh the page if it's correct. Otherwise, I wan't to give them an incorrect alert and stay on the same page so they can guess again:
<div class="ui-widget" align="center">
<form method="post" action="" class="answer_box" onsubmit="return submit();">
<p>Which hero is it? <input id="tags" name="guess" /></p>
<script>
var key = <?php echo json_encode($rand_key) ?>;
var info = document.getElementById("guess").value;
function submit() {
if (key==info){
alert('Correct!');
return true;
}
else {
alert('Incorrect!');
returnToPreviousPage();
return false;
}
}
</script>
</form>
</div>
Right now, it submits the information to a new page regardless of the input. The javascript alerts are also not showing (I suspect they do show, but the page then refreshes and they disappear). The key variable is the key from the randomly taken value of a PHP array, and info should be the text the user inputs.
Problems found:
you cant use submit as a function name a this is an HtmlForm object
document.getElementById("guess").value; is looking for an element with ID of "guess" and that does not exist.
I would rewrite your script like this:
<script>
var key = <?php echo json_encode($rand_key) ?>;
function my_submit(curr) {
var info = curr.guess.value;
if (key == info) {
alert('Correct!');
return true;
}
else {
alert('Incorrect!');
returnToPreviousPage();
return false;
}
}
</script>
<form onsubmit="return my_submit(this);">
<p>Which hero is it? <input id="tags" name="guess"/></p>
</form>
You have a problem here:
<input id="tags" name="guess" />
Your id is tags, not guess.
You should use document.getElementById("tags").value.
You are trying to retrieve the value of an element with id of "guess." Change this to "tags."
var info = document.getElementById("tags").value;
Also, as #CodeGodie mentioned, you need to change your function name to something other than submit.

Clear or Delete file from textField

I am working with PHP's Yii framework and having issues clearing or deleting the uploaded file from the textfield. Currently, it will delete the content from the fileField, but can't get it to delete the textfield. Any ideas?
UPDATE
I can now clear my textField because I've hard coded my clearFileInputField function by adding $('.getFile').val(""); I reference this in my HTML by adding the 'class' => 'getName' in the input section. While this clears the data, it doesn't remove the file after saving. Any suggestions?
HTML
<div id = "clearContent">
<?php echo $form->labelex($model,'info'); ?>
<?php echo $form->textfield($model,'info', array(placeholder => "No file chosen", readonly => true, 'class' => 'getName')); ?><br>
<?php echo $form->fileField($model,'info'); ?>
<?php echo $form->error($model,'info'); ?>
<input type="checkbox" onclick = "clearFileInputField('clearContent')" href="javascript:noAction();"> Remove File
</div>
JavaScript:
<script>
function clearFileInputField(tagId) {
document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML;
$('.getFile').val("");
}
</script>
I am not sure if I understood the problem you are having correctly. If I understood the question completely wrong, please elaborate and I will try to improve my answer.
If you want to remove the the content (the value attribute) of a text and file input you can use code like the following:
// listen to the click on the #clearnbtn element
document.getElementById('clearbtn').addEventListener('click', function() {
// Remove the value of the #foo and #bar elements
document.getElementById('foo').value = "";
document.getElementById('bar').value = "";
});
If you would like to remove an entire field you can do that like so:
// Retrieves the input element, gets its parents and removes itself from it
var fooElement = document.getElementById('foo');
fooElement.parentElement.removeChild(fooElement)
Or you can set the innerHTML attribute of the parent element to an empty string ('').
document.getElementById('clearContent').innerHTML = "";
https://jsfiddle.net/osjk7umh/1/

window.open doesn't do anything

I'm trying to show some info in a pop-up window usig a window.open.. but when I click nothing happens.
This is the function that opens a new window.
function goNewWin(sell_code){
// Set height and width
var NewWinHeight=1000;
var NewWinWidth=1000;
// Place the window
var NewWinPutX=10;
var NewWinPutY=10;
//Get what is below onto one line
TheNewWin =window.open("renovations_history.php?sell_code=" + sell_code,
'Renovaciones','fullscreen=yes,toolbar=no,location=no,status=no,menubar=no,scrollbars=no');
//Get what is above onto one line
TheNewWin.resizeTo(NewWinHeight,NewWinWidth);
TheNewWin.moveTo(NewWinPutX,NewWinPutY);
}
</script>
Here's the HTML, with some PHP.
<form>
<input type="button" value="Renovaciones" onClick="goNewWin(<?php echo $row['sell_code']; ?>)">
</form>
Nor it works with:
Renovaciones
It's 2:22 am and I can think straight, please help.
You need to add single quotes to the JavaScript function call:
<?php
$sell_code = $row['sell_code'];
?>
<input type="button" value="Renovaciones" onClick="goNewWin('<?php echo $sell_code]; ?>')">
Without it, Javascript will consider your $row['sell_code'] as a javascript keyword.
You need to pass it as a string (function parameter).
Reference
if $row['sell_code'] is a string the you can use
$sellCode = $row['sell_code'];
onClick="goNewWin('<?php echo $sellCode; ?>')">

Error while passing checkbox values to a Javascript function

I have a checkbox which stores values from database table. So it contains an array of values when I display them on my page.
<input type="checkbox" id="chkdelt[<?php echo $id; ?>]" name="chkdelt[]" value="<?php echo $id; ?>">
Above given is the checkbox code.
I have a popup block which shows the count of checked checkboxes.
<div class="popup">
Show count here <span id="numb"></span>
<button type="button" onclick="paz(<?php echo json_encode(chkdelt); ?>);">Click</button>
</div>
And I am able to show the count successfully using this javascript function given below.
// used to show number of checked checkboxes in popup
function dumpInArray(){
var arr = [];
$('.table-responsive input[type="checkbox"]:checked').each(function(){
arr.push($(this).val());
});
return arr.length; //returns no of checked check boxes
}
$('.select_chk').click(function () {
$('#numb').html(dumpInArray()); // output of dumpInArray() written into numb span
});
And I try to pass this array to a Javascript function while clicking the button inside of popup.
My Javascript is given below:
function paz(a)
{
var temp = new Array();
temp = JSON.parse(a);
for(i=0;i<temp.length;i++)
{
alert(temp[i]);
}
}
The values are not passed to paz() in Javascript. Rest works fine. I want to pass the values of all checked checkboxes to the paz() when I click the button in the popup div.
Thanks. Help???
You need to pass argument to JavaScript function as a string.
You're passing them as a variable which in turn will be becoming as undefined.
To pass argument as a string use function_name('arg') or function_name("arg").
So in your code change:
<button type="button" onclick="paz(<?php echo json_encode(chkdelt); ?>);">Click</button>
to
<button type="button" onclick="paz('<?php echo json_encode(chkdelt); ?>');">Click</button>
Also I'll suggest you to use <input type="button" /> Instead of <button> & I think if chkdelt is variable name in php you'll need to use $ sign before it and use json_encode($chkdelt).
Hope it'll help you.. Cheers :)!

Categories

Resources