I am new in web development. I am trying to show div onclick function so I need some help.
here is my code
<div id="editdiv<?php echo $consultnt->id?>" style="display:none">
<p> edit</p>
</div>
<?php if(trim($consultnt->status) !="completed"){ ?>
<div class="pull-right" id="div_chng_hr">
<input type="submit" name="edit_hour" onClick="showEdit(<?php echo "editdiv".$consultnt->id ?>)" on value="Edit Hour">
</div>
<?php } ?>
and script code here is
function showEdit(id){
$('#editdiv').show();
}
I inspect edit hour button then I have value onclick
<input type="submit" name="edit_hour" onclick="showEdit(editdiv26)" value="Edit Hour">
and div id is
<div id="editdiv26" style="display:none">
tell me where I am doing wrong. Thanks in advance
Since you are giving the function a param
onClick="showEdit(<?php echo " 'editdiv".$consultnt->id." ' "?>)"
eter it shoud be between ' '
So the onClick function should be
And in your function use "#" + id instead of #editdiv
function showEdit(id){
$('#editdiv' + id).show();
}
Your div have different id that "editdiv" because it's extended by consultant id. So you have to use consultant id in your function as well.
Concat the ID properly. Since you have a static editdiv and a dynamic ID use $('#editdiv' + id)
function showEdit(id) {
$('#editdiv' + id).show();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editdiv1" style="display:none">1 </div>
<div class="pull-right" id="div_chng_hr">
<input type="button" name="edit_hour" onClick="showEdit(1)" on value="Edit Hour">
</div>
first thing is make sure you link a jQuery library
<script src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
second thing is code
<div id="editdiv<?php echo $consultnt->id?>" style="display:none">
<p> edit</p>
</div>
<?php if(trim($consultnt->status)!='completed'){ ?>
<div class="pull-right" id="div_chng_hr">
<input type="submit" name="edit_hour" onClick="showEdit(<?php echo $consultnt->id?>)" on value="Edit Hour">
</div>
<?php } ?>
<script>
function showEdit(id){
$('#editdiv'+id).show();
}
</script>
Use this html: remove 'editdiv' text from onClick event
<div id="editdiv<?php echo $consultnt->id?>" style="display:none">
<p> edit</p>
</div>
<?php if(trim($consultnt->status) !="completed"){ ?>
<div class="pull-right" id="div_chng_hr">
<input type="submit" name="edit_hour" onClick="showEdit(<?php echo $consultnt->id ?>)" on value="Edit Hour">
</div>
<?php } ?>
script part:
<script>
function showEdit(id){
$('#editdiv'+id).show();
}
</script>
Please have a look at here working example
`https://jsfiddle.net/yhpduthm/10/`
I prefer in function you have to add only ID and that will use in function.
Related
I have a select in my HTML form:
<form name="correo" id="correo" method="post" action="#" enctype="multipart/form-data" onSubmit="<!--return checkFields();-->" ><div class="multi-field-wrapper" name="multi-field-wrapper">
<div class="multi-fields" name="multi-fields">
<div class="multi-field" name="multi-field">
<div>
<label for="penviadas[]"> Cantidad </label>
<input type="number" name="penviadas[]" class="penviadas" id="penviadas" maxlength="70" placeholder="¿Cuántas?" onClick="removerIcon('iconcant');" >
</div>
</div>
</div>
<button type="button" class="add-field">Añadir otra referencia</button>
</div>
And I can add fields dynamically (or what's the same, I can repeat the code above many times; the code below works).
$('.multi-field-wrapper').each(function() {
var $wrapper = $('.multi-fields', this);
$(".add-field", $(this)).click(function(e) {
$('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();
});
$('.multi-field .remove-field', $wrapper).click(function() {
if ($('.multi-field', $wrapper).length > 1)
$(this).parent('.multi-field').remove();
});
});
Let's say I have 3 different selects (penviadas). What I want is to get all of them in my PHP file once I submit the form. It used to work, but now, for some reason, I can only get THE FIRST select (penviadas). Why am I not getting all the values from penviadas array?
PD: I print it in my PHP in different ways but they all return ONLY THE FIRST ELEMENT from penviadas, not the rest:
var_dump($_REQUEST['penviadas']);
I figured it out after many hours playing stupid.
With the information in the OP it was impossible to discover where there was a problem. I found the solution here: Submitting form from different <div> HTML
Basically, I had this structure:
<div...
<form...
</div...
</form>
I thought it was alright and didn't think for a moment this could be affecting. Thus, it wasn't the PHP/JS but the html tags that were incorrect. Thanks for your time.
PHP Code :
<?php
if(isset($_POST['test']))
{
$data = $_POST['referenciasnuevas'];
foreach ($data as $key => $value) {
echo $value . "<br />";
}
}
?>
Html Code:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<form method="post" action="#">
<div class="multi-field-wrapper" name="multi-field-wrapper">
<div class="multi-fields" name="multi-fields">
<div class="multi-field" name="multi-field">
<label for="referenciasnuevas[]">Referencia pieza</label>
<select name="referenciasnuevas[]" id="referenciasnuevas" class="referenciasnuevas" style="width: 105px" onClick="removerIcon('iconref');">
<option selected value='-1'> ¿cliente? </option></select>
</div>
</div>
<button type="button" class="add-field">Añadir otra referencia</button>
</div>
<input type="submit" name="test" value="Submit">
</form>
<script>
$('.multi-field-wrapper').each(function() {
var $wrapper = $('.multi-fields', this);
$(".add-field", $(this)).click(function(e) {
$('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();
});
$('.multi-field .remove-field', $wrapper).click(function() {
if ($('.multi-field', $wrapper).length > 1)
$(this).parent('.multi-field').remove();
});
});
</script>
</body>
</html>
The above code works for me.please look my code
I have a Print button which I want to do 2 actions when clicked:
Updating my database.
Printing the HTML page.
This is what I've done so far, but it's not working:
<form action="" method="POST">
<body >
<?php
$n=$_POST['ID'];
$a=implode("</br>",$n);
list($add, $ward) = explode("(!#!)", $a);
?>
<div id="container">
<p id="address">
<?php echo"$address";?>
</p>
<p id="ward">
<?php echo"$ward";?>
</p>
</div>
<input type="submit" name="Print" value="Print" />
<?php
if(isset($_POST['Print']))
{
?><script>javascript:window.print()</script><?php
mysql_query("UPDATE `source_main` SET `source_status`=3 WHERE `source_id`=1");
}?>
<div id="footer">
</div>
</form>
After using this print button , my database is getting updated, but the print window is showing error(i.e the variables posted from other page are showing errors).
Can anyone please help me print and update at same time with this Print button?
If your page does not have it, add form tags. They are mandatory unless you want to AJAX the data. Also remove the semi-colon from the end of the sql
<form action="" method="POST">
<input type="submit" name="Print" value="Print" />
</form>
<?php
if(isset($_POST['Print'])) {
mysql_query("UPDATE `source_main` SET `source_status`=3 WHERE `source_id`=1");
?><script>window.print();</script>
<?php } ?>
UPDATE: Perhaps you mean this, but I do not want to keep correcting HTML.
<?php
$n=$_POST["ID"];
$a=implode("</br>",$n);
list($add,$ward)=explode("(!#!)", $a);
?>
<body>
<div id="headerbg">
<div id="header-e1"><a align="left" href="escalationReport.php">Back </a>
</div>
<div id="header-e3"><a align="right" href="logout.php">Logout </a>
</div>
<h1><p>Issue Notice</h1>
</div>
<div id="container">
<p id="address">
<?php echo "$address";?>
</p>
<p id="ward">
<?php echo "$ward";?>
</p>
</div>
<form action="" method="POST">
<input type="submit" name="Print" value="Print" />
</form>
<?php if(isset($_POST[ 'Print'])) {
mysql_query( "UPDATE `source_main` SET `source_status`=3 WHERE `source_id`=1");
?>
<script>
window.print();
</script>
<?php } ?>
<div id="footer"></div>
</body>
you have an error in the update query, you have placed semicolon inside the query so please remove that so the query will be like this.
Make sure your form method is POST
mysql_query("UPDATE `source_main` SET `source_status`=3 WHERE `source_id`=1");
Make sure you are using input type button inside the form tag. And use post method for form.
NOTE: Here is the fiddle, and since that looks awful, Here is the full screen result
Here is the fiddle after I do my changes on my computer and generate the html, and here is the full screen
Note on the fiddle:
I added the entire code into the fiddle since it won't work unless it's the whole code.
Thanks to anyone who will give hints! My only problem here is the one in the title, nothing else. :)
=====
I'm working on an undergraduate project to create an interface that accesses a database (though I'm not a CS student). My code is behaving very strangely. I have code for one window that displays one large div encasing three divs side byside, which is structured this way:
<div id="container">
<div id="window1">
<form></form> //my buttons
</div>
<div id="window2">
<form></form> //my body
</div>
<div id="window3">
//I havent written anything here yet
</div>
</div>
But I realized it makes more sense for me to encase them all in just one form. Like this:
<div id="container">
<form>
<div id="tab1">
</div>
<div id="tab2">
</div>
<div id="tab3">
</div>
</form>
</div>
So in the first case, this is what my website looks like:
But after I change it:
What's weird is, if I put forms in my forms, it starts working again! So this works:
<div id="container">
<form>
<div id="tab1">
<form></form>
</div>
<div id="tab2">
<form></form>
</div>
<div id="tab3">
</div>
</form>
</div>
If you need to see my code, I actually am using PHP to generate the html since it's a lot, so (this is the method that doesn't work):
<div id="search_separator" class="upper_tab">
<form action="" method="post">
<div id="button_container">
<?php
$tbs_a = 1;
$tbs_name = 'table_selector';
$printRetain_button = '';
$fg = input::get($tbs_name);
echo '<label for="',$tbs_name,'"></label>';
foreach($table_arrays AS $ta => $table){
$tbs_val = "table".$tbs_a;
if($tbs_a==1){
echo '<div class="button"><input type="radio" class="tabl_selector" name="',$tbs_name,'" value="',$tbs_val,'" checked="default"/><div class="table_selector">',$ta,'</div></div>';
}else{
echo '<div class="button"><input type="radio" class="tabl_selector" name="',$tbs_name,'" value="',$tbs_val,'"';
if($tbs_val == $fg){
echo ' checked="checked"';
}//make a separate echo for table1 radio button with the default turned on.
echo '/><div class="table_selector">',$ta,'</div></div>';
}
$tbs_a++;
}
?>
<!--<input type="submit" name="submit" value="submit" />-->
</div>
<div id="search_container" class="content">
<?php
$a = 1;
$search = DB::getInstance();
foreach($table_arrays AS $t_a => $table){
$y = 1;
echo '<div id="table',$a,'_content" class="table_content">';
echo "<h2>",$t_a,'</h2><table align="center" id="actualhtmltable">';
foreach($table AS $t => $field){
$name = "table".$a."_field".$y;
$val_sticky = escape(input::get($name));
$val_find = $search->get($t_a, array($t, '=', input::get($name)));
//$val_find = $search->get('user_credentials', array('user_id', '=', 28))->results();
if(!empty($val_find)){
$val = array();
foreach($val_find[0] AS $vfz){
$val[] = $vfz;
}
} elseif(!empty($val_sticky)){
$valu = $val_sticky;
} else {
$valu = "";
}
echo '<tr><div><td>',$t,'</td><td><label for="',$name,'"><input type="text" class="entryfields" name="',$name,'" value="';
if(!empty($val[$y-1])){
echo $val[$y-1];
} else {
echo $valu;
}
echo '" /></label></td></div></tr>';
$y++;
}
echo '</table></div>';
$a++;
}
?>
<div class="Tableformbutton">
<div class="FindModeButtons">
<input type="Submit" name="find" value="Find" id="find" class="findupdateinsert" />
<input type="Submit" name="update" value="Update" id="update" class="findupdateinsert" />
</div>
<input type="Submit" name="insert" value="Insert" id="insert" class="findupdateinsert" />
</div>
</div>
<div id="other_container">
<!--find mode on and other functionalities-->
</div>
<div class="hassubmit" id="searchsubmit_container">
<input type="button" id="findmodetoggler" name="query_submit" value="Toggle Find Mode" class="top_buttons" />
<a href="#" class="tip"><input="button" name="Help" value="Help" class="top_buttons" id="help" />
<span> Click "Toggle Find Mode" to toggle between find/update and insert buttons.<br />
If find mode is on, you will be able to look for existing records and update them. Otherwise, you can only insert new entries.<br />
Find mode is off by default.</span>
<p>Need Help?</p>
</a>
</div>
</form>
</div>
As far as I can tell, it is supposed to work! I don't see anything in my HTML, and as for my CSS, I have styled nothing about forms in there, only divs and labels and input tags. What could be wrong?
Thanks to anyone who'll give hints or ideas!
I found the solution, which really is just so simple. But, I don't know why it happened this way.
I added an id="search_form" into the form I need, then used CSS to say .search_form{ height: 100% } as apparently, when the form was made, it made the height of everything into just a few pixels. This is weird, but at least I found the answer.
I am a rookie PHP developer.
I have a PHP web project with an HTML page that contains an Add button. The name of the page is Awards.html. Elsewhere I have created a PHP class, Awards.php which contains a function.
The source code of my files is given as follows:
Awards.html
<div class="divparent">
<div class="modal-header">
<div class="btn-group">
<button class="btn" data-bind="click: closeModal">Exit</button>
</div>
</div>
<div class="modal-title">
<h1 id="headerid">Awards</h1>
</div>
<div class="modal-body">
<input id="hdnValueCurrentAwardSoid" type="hidden" value="null" />
<div class="divleft">
<input id="txtName" maxlength="80" type="text" class="water newpost1" placeholder="Award Name" tabindex="1" />
<section class="ThumbnailContainer">
<img id="imgThumbnail" class="imgThumbnail" />
<img src="http://localhost/rockontechnologies/Images/GreenRibbon.png" id="pictureribbon" class="pictureribbon" />
<input type="text" contenteditable="false" readonly id="transformtext" />
</section>
<textarea id="txtdescription" placeholder="Description" class="water newpost1" rows="4" tabindex="2"></textarea>
<div class="ui-widget">
<input id="txtIssueOrg" maxlength="50" type="text" placeholder="Issue Organization" />
</div>
</div>
</div>
<div class = "divbottom">
<div id="divAddAward">
<button class="btn" onclick="">Add</button>
</div>
</div>
</div>
Awards.php
<?php
class Awards
{
function clickFunction()
{
//Function that needs to be executed!
}
}
The problem here is that on the click event of the Add button, I need to call the clickFunction() of the Awards.php file. Can anyone please tell me how to do this?
Replies at the earliest will be highly appreciated. Thank you.
You should do something like that
<button class="btn" onclick="onrequest();">Add</button>
function onrequest() {
$.post(
'example.php'
).success(function(resp){
json = $.parseJSON(resp);
alert(json);
});
}
and in example.php call your function
$class = new Awards();
$method = $class->clickFunction();
echo json_encode($method);
and in your clickFunction();
clickFunction(){
$array = array(
'status' => '1'
);
return $array;
}
first of you have to a instance of class which is like that
$class = new Awards();
then if you want to onclick event you should make a javascript code but how to get the function you can do like this
<?php echo $class->clickFunction(); ?>
I think you can't call a class directly from HTML in PHP you have to call it through HTTP by loading a page.
Hence, use a AJAX call to call Awards.php. Eg. with JQuery it could look like this $.get("Awards.php", function() {
alert( "success" );
})
In your php-file you should also call your class something like this <?php echo $class->clickFunction(); ?>
Hello coders. I have a problem with inserting data into a database, can you please help me with the controller function?
Here is my php form:
<form method='post' action='<?php echo site_url('a3_bus_system/output')?>'>
<div class="_25">
<strong>Route Name/Number</strong>
<br/>
<input type="text" name=""></input>
</div>
<p> <p> </p></p>
<p> <p> </p></p>
</p>
<div id="div">
</div>
<p> </p><div class="_25">
<p><input type="button" name="button" class="button red" id="button" value="Add" onclick="generateRow() "/></a></p>
</div>
<input type='button' value='Remove Button' id='removeButton'>
<p> </p><p> </p></div>
<input type="submit" class="button blue" id="button" value="Register" />
</form>
</div>
</div>
<div class="clear height-fix"></div>
</div></div> <!--! end of #main-content -->
</div> <!--! end of #main -->
<script>
var counter=1;
function generateRow() {
var count="<font color='red'>"+counter+"</font>";
var temp =" <p> <div class='_25'><input type='textbox' id='textbox' name='stop["+counter+"]' placeholder='Stop Name'></input></div> <div class='_25'><input type='textbox' id='textbox' name='timing["+counter+"]' placeholder='Timing'></input></div> <div class='_25'><select id='ampm' name='ampm["+counter+"]'><option>a.m</option><option>p.m</option></select> </div>";
var newdiv = document.createElement('div');
newdiv.innerHTML = temp + count;
var yourDiv = document.getElementById('div');
yourDiv.appendChild(newdiv);
counter++;
}
</script>
adn this is my controller function :
public function output()
{
$common['common']=$this->common;
$this->load->helper('form');
$this->load->database();
foreach ($_POST['stop'] as $stopIndex => $stopValue) {
if($stopValue!=NULL)
{
echo $stopIndex;
echo $stopValue;
}
}
foreach ($_POST['timing'] as $timingIndex => $timingValue)
{
if($timingValue!=NULL)
{
echo $stopValue['data'];
}
}
foreach ($_POST['ampm'] as $ampmIndex => $ampmValue) {
if($timingValue!=NULL)
{
echo $ampmValue;
}
}
$this->output->enable_profiler(TRUE);
}
And these are my database fields:
route_number stop_name am_pm timing
Please give me a way to insert a query to post all these input fields into a database.
Do you have the model already made? In Codeigniter you are supposed to do all your direct DB activities with a model. All you need to know about models is explained here: http://ellislab.com/codeigniter/user-guide/general/models.html
Once there you would do the insert like explained here: http://ellislab.com/codeigniter/user-guide/database/examples.html Eventhough I always use the Active Record Class way (http://ellislab.com/codeigniter/user-guide/database/active_record.html), it's simpler and the abstraction is really helpful.
You cant post array in Database directly...
Serialize the data before inserting
and Unserialize after fetching