In my view the form as
<table width="90%" border="0" cellspacing="2" cellpadding="2" id="table-data" align="center" style="border:1px dashed #CCCCCC" class="table table-vcenter table-striped">
<tr class="tr_clone">
<td> % Completion</td>
<td> <?php echo $form->textField($model_result,'floatPaymentpercentage[]',array('class'=>'form-control','placeholder'=>'%')); ?></td>
<td> <?php echo $form->textField($model_result,'varAmount[]',array('class'=>'form-control','placeholder'=>'Amount')); ?></td>
<td><input type="button" name="add" value="Add" class="tr_clone_add btn btn-xs btn-warning"></td>
</tr>
Here i have two textboxes for payment terms..if i save ones it will be saved.
If i add more the last will not saved in database
In my controller we can use print_r()
echo ("<pre>"); print_r($_POST); echo ("</pre>");exit;
The default text field values only shown here.
Here the text fields are added dynamically.
The dynamic added text field's values are not displayed.
In my model the rules are
public function rules()
{
return array(
array('floatPaymentpercentage','required'),
array('varAmount','required'),
);
}
here is the java script for add more
<script type="text/javascript">
$(document).on('click','.delete',function(){
$(this).closest('tr').remove();
});
$("input.tr_clone_add").live('click', function() {
if($(this).val() == "Add")
{
var $tr = $(this).closest('.tr_clone');
var $clone = $tr.clone();
$clone.find(':text').val('');
$tr.find('.tr_clone_add').val('Delete')// set value to Delet
$tr.find('.tr_clone_add').val('Delete')// set value to Delet
.toggleClass('tr_clone_add delete')// toggle classes
.unbind('click'); // unbind the current events from button
$tr.after($clone);
}
else
{
$(this).closest('tr').remove();
}
});
</script>
Please help me to fix this.
Here i can add js for funuction add more
Thanks
Related
I have displayed all the student's name in table format through ajax. Now I want to associate a form input field to each student so that I can insert his marks and store it in database? How can I achieve this?
Below is my code..
<script type="text/javascript">
function select_std() {
var ali = $('#class_std').val();
$('#std_name').html('');
$.ajax({
url: "<?php echo base_url().'admin/test/'?>" + ali,
type: "GET",
success: function(res) {
$('#myTable tbody').append(res);
}
});
}
</script>
and my controller :
public function test($id=''){
$table='students';
$columns=array('*');
$where=array('c_id'=>$id);
$data['rcd']= $this->Crud->get_records($table, $columns, $where)->result();
foreach ($data['rcd'] as $value) {
$output = "<tr><td>".$value->Name."</td><td>90</td><td>very good<td></tr>";
echo $output;
}
}
This is my table format in which I have showed all the student's names in the first <td> through ajax from database. and I want to make the second <td> as input field to store his marks in database.
<table cellpadding="1" cellspacing="1" id="myTable" class="table table-boardered table-responsive" id="example2">
<thead>
<th width="20px;">Name</th>
<th>Marks obtained(100)</th>
<th>comments</th>
</thead>
<tbody id="std_name">
</tbody>
</table>
You should put a form on the table/your loop so that every student has a designated input field then if you want to make an action to a specific student get the ID of the specific student then inserts it to the DB. (get(id) = idfromdb).
<?php foreach ($data['rcd'] as $value) { ?>
<tr><td><?php $value->Name ?></td><td>90</td><td>very good<td></tr>
<tr><td>
<input field here>
<input button value=$value[id]>
</td></tr> <?php } ?>
then in the next page or the same page its up to you:
<?php if(isset($_POST['button name'])){
$id = $_POST[button name];
insert your data to your db where $id = idfromdb }?>
ahaha sorry dude I forgot php. :(
Am just trying to show all the list in the pagination. am using datatable plugin's pagination on my file, pagination is working fine, in the list i have an image that have a function delete on click. in my pagination 1'st five records is shown . and the other five records shown on click next, delete function working properly on 1'st five record when i click on next than delete function stop it's working .
my code:-
<script>
var conf = jQuery.noConflict();
conf(document).ready(function(){
conf(".delete").on( "click", function() {
alert('adfasdfasd');
//alert(conf(this).attr("id"));
custid = conf(this).attr("id");
var r=confirm("Are you sure");
if (r==true)
{
var url = "<?php echo Mage::getBaseUrl();?>turnkey/index/deleteuser/";
conf.ajax({
type:"POST",
url:url,
data: { 'custid':custid},
success: function(msz){
alert(msz);
if(msz=="deleted") {
conf("#hidepro"+custid).hide("slow");
}
else {
//conf("#hidepro"+proid).hide();
alert("product cant be deleted");
}
//console.log("chal hun");
}
});
}
else
{
return false ;
}
});
});
</script>
and the pagination code is :-
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#example').dataTable();
} );
</script>
<div id="container">
<div id="demo">
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example" width="100%">
<thead>
<tr>
<th>Factory</th>
<th></th>
<th>Contact</th>
<th>URL</th>
<th>Remove</th>
</tr>
</thead>
<tbody>
<?php
foreach( $custemail as $custemail1 ) {
$customer = Mage::getModel("customer/customer");
$customer->setWebsiteId(Mage::app()->getWebsite()->getId());
$customer->loadByEmail($custemail1); //load customer by email id ?>
<tr class="odd gradeX" style=" border-bottom: 1px solid #FF0000;" id = "hidepro<?php echo $customer['entity_id'] ?>">
<td class="bodyText style4" ><a style=" color: #CC3300;float: left;margin-top: 42px !important;text-decoration: underline;" href="<?php echo Mage::getBaseUrl();?>turnkey/index/listuser?id=<?php echo $customer->getEntity_id();?>"><?php echo $customer->getFactory();?></a> </td>
<td class="bodyText style4">
<a href="<?php echo Mage::getBaseUrl();?>turnkey/index/listuser?id=<?php echo $customer->getEntity_id();?>">
<img style=" width:100px;height:100px;margin-bottom:5px ;" src = "http://lab.ghrix.com/turn-key-mart/media/<?php echo $customer->getUserImage();?>"></a>
</td>
<td class="bodyText style4" style="padding-top: 10px;">
<?php echo $customer->getFirstname();?><?php //echo $customer->getUser_address();?><br><?php echo $customer->getmobile();?><br><?php echo $customer->getEmail();?></td>
<td class="bodyText style4" style="float: left;margin-top: 42px !important;" >
<a target="_blank" style="color:#005580;" href="<?php echo $customer->getWebsite();?>"><?php echo $customer->getWebsite();?></a></td>
<td class="bodyText style4"><div style= "cursor:pointer;" class = "delete" id = "<?php echo $customer['entity_id'] ?>"><img width="60px" src="<?php echo $this->getSkinUrl('images/trash.jpg'); ?>"</div></td>
</tr>
<?php }?>
</tbody>
</table>
</div>
</div>
please suggest where mistake is happen.
Without a live example, I can't be sure, but try this:
replace
conf(".delete").on("click", function() ...
with:
conf(document).on("click", ".delete", function() ...
The reason is that conf(".delete") only attaches to elements available at the time the function is run. It might be that your dataTable plugin runs first, removes the extra elements, then the delete binder is run and only works on the first 5. The second method binds to the document, and checks each click to see if it matches the .delete selector. This used to be known as jQuery.live()
Here's my code for generation of the table. I call it via jQuery and ajax.
echo '<table class="database-items table table-bordered">
<tbody>';
foreach($stmt as $item){
echo '
<tr>
<td>'.$item['title'].'</td>
<td>
<img src="wp-content/themes/twentyeleven-child/'.$item['image_path'].'" alt="">
</td>
<td>'.$item['asin'].'</td>
<td>'.$item['weight'].'</td>
<td>'.$item['dimension'].'</td>
<td>'.$item['category'].'</td>
<td>
<button type="button" class="btn btnDeleteitem" alt="'.$item['asin'].'">
<i class="icon-remove"></i>
</button>
</td>
</tr>';
}
echo '</tbody>
</table>';
And if I click the btnDeleteItem button, I want to remove that row, the values will be based on it's td with $item['asin']
Here's my jquery for btnDeleteItem but I don't know how what to put inside
$('.btnDeleteitem').live('click', function() {
//what to put here?
}
Find the button's closest tr ancestor an remove it
$('.btnDeleteitem').live('click', function() {
$(this).closest('tr').remove();
}
Since .live() was deprecated as of jQuery 1.7 use .on() for event deligation
$(document/* or closest existing ancestor of .btnDeleteitem*/).on('click', '.btnDeleteitem', function() {
$(this).closest('tr').remove();
}
I want the user to be able to add a question from a table row into a textarea. The textarea the question goes into depends on the ".plus" button the user selected to choose their question.
E.g. If the user clicked on the plus button on the top of the page, then the question when the user clicks on the "Add" button goes into the textarea on top of the page.
Another E.g. If the user clicked on the plus button in the 5th table row, the question when the user clicks on the "Add" button goes into the textarea within that row (5th row).
The problem I am having though is that when the user clicks on the "Add" button, nothing happens. It is suppose to close the modal window and insert the question into the correct textarea but nothing is happening. It is not closing the modal window and it is not inserting a question into a textarea.
What am I doing wrong?
Below is the code for the application:
<head>
<script type="text/javascript">
function insertQuestion(form) {
var $tbody = $('#qandatbl > tbody');
var $tr = $("<tr class='optionAndAnswer' align='center'></tr>");
var $plusrow = $("<td class='plusrow'></td>");
var $question = $("<td class='question'></td>");
$('.questionTextArea').each(function () {
var $this = $(this);
var $questionText = $("<textarea class='textAreaQuestion'></textarea>").attr('name', $this.attr('name') + "[]").attr('value', $this.val());
$question.append($questionText);
});
$('.plusimage').each(function () {
var $this = $(this);
var $plusimagerow = $("<a onclick='return plusbutton();'><img src='Images/plussign.jpg' width='30' height='30' alt='Look Up Previous Question' class='imageplus'/></a>").attr('name', $this.attr('name') + "[]").attr('value', $this.val());
$plusrow.append($plusimagerow);
});
$tr.append($plusrow);
$tr.append($question);
$tbody.append($tr);
form.questionText.value = "";
$('.questionTextArea').val('');
}
function plusbutton() {
// Display an external page using an iframe
var src = "previousquestions.php";
$.modal('<iframe src="' + src + '" style="border:0;width:100%;height:100%;">');
return false;
}
function closewindow() {
$.modal.close();
return false;
}
$(document).on('click', '.add', function () {
console.log("clicked");
//lets get our Question Text...
var theQuestion = $("td:first-child", $(this).parent()).text();
//the row is present, let's then make sure that the proper cell gets oru data.
if ($('.activePlusRow').length > 0) {
$('.activePlusRow').next('.textAreaQuestion').val(theQuestion);
$('.activePlusRow').removeClass('activePlusRow');
}
$.modal.close();
return true;
});
$(document).on('click', '.plusrow', function () {
//adding a unique class for the purpose of the click.
$(this).addClass('activePlusRow');
});
</script>
</head>
<body>
<form id="QandA" action="<?php echo htmlentities($action); ?>" method="post">
<div id="detailsBlock">
<table id="question">
<tr>
<td rowspan="3">Question:</td>
<td rowspan="3">
<textarea class="questionTextArea" rows="5" cols="40" name="questionText"></textarea>
</td>
</tr>
</table>
<table id="plus" align="center">
<tr>
<th>
<a onclick="return plusbutton();">
<img src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage" name="plusbuttonrow"/>
</a>
<span id="plussignmsg">(Click Plus Sign to look
<br/>up Previous Questions)</span>
</th>
</tr>
</table>
<table id="questionBtn" align="center">
<tr>
<th>
<input id="addQuestionBtn" name="addQuestion" type="button" value="Add Question"
onClick="insertQuestion(this.form)" />
</th>
</tr>
</table>
</div>
<hr/>
<div id="details">
<table id="qandatbl" align="center">
<thead>
<tr>
<th class="plusrow"></th>
<th class="question">Question</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</form>
</body>
The details stored in the modal window comes from a seperate script known as "previousquestions.php", Below is the code where it shows the result of the "QuestionContent" field only displayed and it's "Add" button after the user has compiled a search:
<?php
$output = "";
$output .= "
<table border='1' id='resulttbl'>
<tr>
<th id='questionth'>Question</th>
</tr>
";
while ($questionrow = mysql_fetch_assoc($questionresult)) {
$output .= "
<tr>
<td id='questiontd'>{$questionrow['QuestionContent']}</td>
<td id='addtd'><button type='button' class='add'>Add</button></td>
</tr>";
}
$output .= " </table>";
echo $output;
}
}
?>
Thank you
var $questionText = $("<textarea class='textAreaQuestion'></textarea>")
.attr('name',$this.attr('name')+"[]")
.val($this.val()); // .val() for set value to textarea
I'm trying to to make a form that will submit a new record and automatically show that as DIV inside of the main DIV and after all the results from the PHP while loop.
Here is the while loop that I've built:
<?php
while ($row_apps = mysql_fetch_array($result_apps))
{
if ( ($row_apps['type'] == 'ar') && ($row_apps['client'] == NULL) ) {
echo '<center>
<div id="_'.$row_apps['app_id'].'" class="tab_listing">
<table width="248" border="0" cellspacing="10px" cellpadding="0px">
<tr>
<td width="100%" colspan="3"><div class="tab_listing_header">'.$row_apps['app_name'].'</div></td>
</tr>
<tr>
<td class="tab_listing_values"><b>App ID: </b>'.$row_apps['app_id'].'</td>
<td class="tab_listing_values"><b>Users: </b>'.$row_apps['users'].'</td>
</tr>
</table>
<div id="edit">Edit</div>
<div id="delete"></div>
</div>
</center><br>';
}
}
?>
Now basically what i need to do is when a form is submitted and the new record is in the database i want it to show a new "block" exact same like the while "blocks" live.
I was thinking about something like:
$.post("create.php",{ value1:$('#value1').val(),value2:$('value2').val(),rand:Math.random() } ,function(data)
{
if(data=='yes')
{
HERE I'M STUCK.
Thanks!
Try this
$.post("create.php",{ value1:$('#value1').val(),value2:$('value2').val(),rand:Math.random() } ,function(data)
{
if(data)
{
$("mainDivSelector").html(data);
}
);
data will contain a result string returned by create.php and that is entirely up to you. What does create.php do at the moment?