send data to controller by jquery jeditable plugin Code igniter - php

i have a data showing on my view page in a table .. i am using a jeditable plugin which is that if i click on lets say some text it becomes editable and then i want to send the new edit value to controller . i dont know how to send the new values to the controller ..this is what i am doing but it is not working .here is my view page..if it can be done through ajax then it ill be better for me..
<?php foreach($records as $row){?>
<tr>
<td class = "click"><?php echo $row->cat_name; ?> </td>
my javascript
<script type="text/javascript">
$(document).ready(function() {
$('.click').editable('<?php echo site_url('categoryController/editCategory');?>',
{
});
});

Related

Edit and save row data of datatables using jquery

I am working with user role module and display users using datatables with that I have few requirements.
1) when click on edit button make complete row editable and change edit button to save button
2) after editing data from editable row and click on save button(ajax call will update data in db) again it should become edit
3) At a time single row edit and save button work it should not like click on first row and without saving changes clicking on every edit button and making every row editable
<?php
$users=$this->db->get('users')->result();?>
<table class="table table-hover" id="catgeory_list">
<tr>
<th>username</th>
<th>role</th>
</tr>
<?php
foreach($users as $user){?>
<tr>
<td><?=$user->name?></td>
<td class='change_response'<?=$user->id?>></td>
</tr>
<?php}?>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
myTable=$('#catgeory_list').DataTable();
}
$(".edit_role").click(function(){
var id=$(this).attr("data-dataid");
alert(id);//
$(".change_response"+id).html("<a href='javascript:void(0)' class='save_role' dataid='"+id+"'>save</a>");
//1) make single row editable at a time and change button from edit to save
});
$("body").on('click','.save_role',function(){
var id=$(this).attr("dataid");
$(".change_response"+id).html("<a href='javascript:void(0)' class='edit_role' dataid='"+id+"'>Edit</a>");
// ajax call to update data in db
});
</script>

how to display image on a form select box change

I'm trying to created a select box in my form and display the image that is selected in the select box next to it. I know it requires jquery or something and I have no clue when it comes to that. If anyone can help or point me in the right direction that would be awesome!!!
<table width="100%">
<tr>
<td>
<select id="icon" name="icon" class="form-control select2">
<?php foreach ($icons as $icon) { ?>
<option value="<?php echo $icon['link']; ?>">
<?php echo $icon['name']; ?>
</option>
<?php } ?>
</select>
</td>
<td align="center" id="iconPreview">
Image Here
</td>
</tr>
</table>
i found this jquery snippet but it doesn't display anything on change...
JQuery:
<script>
$(document).ready(function() {
$("#icon").change(function() {
$("#iconPreview").empty();
if ( $("#icon").val()!="" ){
$("#iconPreview").append("<img src=\"" + $("#icon").val() + "\" />");
}
else{
$("#iconPreview").append("displays image here");
}
});
});
</script>
You'll need to add jQuery if you want to use jQuery in the head, so in your document in the <head> add this line:
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
Then give the TD you want the image in a class:
<td class="imageHere" align="center" id="seleced_image">
Then, at the bottom of your page (or a .js page if you want to link it) add this:
<script>
$(function(){
$('#icon').change(function(){
var image = $('#icon').val();
$('#seleced_image').html("<img src='" + image + "' alt='description' />");
});
});
</script>
This jQuery is saying "Everytime the #icon dropdown changes, load the image into the <td>
This is the simplest way to do it without learning any jQuery. Otherwise, I suggest you learn jQuery or better yet, javascript.
Changes made:
Its better to work with IDs than classes on cases like this.

Creating image pop-up from uploaded database field

I'm trying to create a pop-up to show images which have been uploaded into my database.
I have tried
echo '<td><a class=help href="'.$dbRow['image'].'"></td></tr>';
the class represents the pop-up class
<SCRIPT type="text/javascript">
$('.help').popupWindow({ height:400, width:500, top:100, left:100 });
</SCRIPT>
Any suggestions how I get the image to display from the database as a pop-up? The image field is retrieving on my webpage from the database but need it to click as a pop-up to display
Use jQuery for this.
Use an loop to echo all images to the certain div.
<div class="help">
<?php
foreach($key as $value) {
echo '<a class="help" href="'.$value.'"><br/>';
}
?>
</div>
then display the dialog
<script>
$('.help').dialog({
//your dialog options here
height:'500',
width:'500',
});
</script>
See jQuery dialog for more info about the dialogs

Need to get the name of link clicked to a modal so that I can run a PHP/SQL query in the modal

I'm using twitter bootstrap's modal.
I have a table that maps mac addresses to vendor names. The code looks something like this
<tbody>
<?php foreach ($rowarr as $k => $v) { ?>
<tr>
<td><?php echo $k ?></td>
<td>
<div class="divBox">
<a data-toggle="modal" href="#myModal"><?php echo $v; ?></a>
</div>
</td>
</tr>
<?php } ?>
</tbody>
I would like to click on the vendor name (like Cisco, HP) and launch a modal dialog box with more details about the vendor. The details in this modal box would come from a database. I want to use PHP to query the database, but for querying I need to know the name of the link/vendor that was clicked. How can I do so ?
My JS for launching the modal looks like this atm
<script type="text/javascript">
$('#myModal').modal('hide');
</script>
First thing you can do is set the data-vendor in the link by doing:
<a data-toggle="modal" data-vendor="<?= $v ?>" href="#myModal"><?php echo $v; ?></a>
Or you could get the vendor by:
vendor = $("#myModal").html();
Then wire up your click event for the link by doing:
<script type="text/javascript">
$('#myModal').click(function(){
$(this).modal('hide');
var vendor = $(this).data('vendor');
//DO SOME AJAX CALL OR REFRESH THE PAGE USING "vendor"
});
</script>
I also noticed that you are trying to select using by the id $('#myModal'), but there isn't an "id" attribute. You would probably want a class called "myModal" on the "a" tag and then select by using:
$('.myModal').click(function(){ ... });

querystring with codeigniter and facebox plugin

I am beginner in CI,
i used facebox plugin for loading a page [query result ] in CodeIgniter,
ie select all the datas from a table.
Its working properly,
The problem is i need to display only the data on a specific day,ie from the user input.
My code is:
<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loadingImage : '<?=base_url();?>facebox/loading.gif',
closeImage : '<?=base_url();?>facebox/closelabel.gif'
})
})
</script>
...........
....
<a href="<?=base_url();?>admission/details" rel="facebox" >view details </a>
if i add a text box to this page how can i pass the value to that controller?
with out changing the facebox properties.
<a id="fb1" href="<?=base_url();?>admission/details" rel="facebox" >view details </a>
<input type="text" onchange="updateFB('#fb1',this.value)">
<script>
function updateFB(el,val){
$(el).attr('href',"<?=base_url();?>admission/details/"+val);
}
</script>
//controller
function admission(){
$date = $this->uri->segment(3);
....

Categories