We Keep Coding

Pass Javascript variable in PHP query

I've created a table with data and auto-generated buttons. When i click in 1 button .add_task, a modal opens, which display another table according to retrieved key: user_id of button.
The functionallity of button is shown below:
$(document).on('click', '.add_task', function(){
var user_id = $(this).attr("id");
$.ajax({
url:"actions/fetch_jobs.php",
method:"POST",
data:{user_id:user_id},
success:function(data)
{
$('#jobModal').modal('show');
$('.modal-title').text("Jobs");
`$('#vis_id')`.val(user_id);
$('#show_inseredjobs').html(data);
}
})
});
The problem is that i want to take value $('#vis_id') or user_id and put it in a php query of opened modal.
<div id="jobModal" class="modal fade">
<div class="modal-dialog">
<form method="post" id="job_form" enctype="multipart/form-data">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Jobs</h4>
</div>
<div class="modal-body">
<div id="show_inseredjobs"></div>
<br/>
<select name="job_desc" class="form-control action" id="job_desc" data-live-search="true" title="Select Job"></select>
</div>
<div class="modal-footer">
<input type="hidden" name="vis_id" id="vis_id" />
<?php
require 'conn.php';
$result = $conn->query("SELECT job_desc FROM jobspervisit WHERE jvid = $('#vis_id') AND job_desc='Fumes'");
if($result->num_rows == 1) {
// row not found, do stuff...
?>
<span class="glyphicon glyphicon-print"></span>print button
<?php
}
?>
<input type="submit" name="action" id="action" form="job_form" class="btn btn-success" value="Προσθήκη" />
<button type="button" class="btn btn-default" data-dismiss="modal">Άκυρο</button>
</div>
</div>
</form>
</div>
</div>
More specifically, i want to do that: $result = $conn->query("SELECT job_desc FROM jobspervisit WHERE jvid = $('#vis_id') AND job_desc='Fumes'");
How can i pass that js variable in php?
I tried different combinations of expressing variable, but the code crashes. If i try to give manually numbers, the code works. To conclude, how can i pass value $('#vis_id') or user_id in $result = $conn->query("SELECT job_desc FROM jobspervisit WHERE jvid = $('#vis_id') AND job_desc='Fumes'");

Your modal is static and you can't run PHP code in the modal.
I think you must do this.
First change:
<?php
require 'conn.php';
$result = $conn->query("SELECT job_desc FROM jobspervisit WHERE jvid = $('#vis_id') AND job_desc='Fumes'");
if($result->num_rows == 1) {
// row not found, do stuff...
?>
<span class="glyphicon glyphicon-print"></span>print button
<?php
}
?>
To:
<div id="job_desc"></div>
And then, in the actions/fetch_jobs.php file when you return data:
require 'conn.php';
$result = $conn->query("SELECT job_desc FROM jobspervisit WHERE jvid = '".$_POST["user_id"]."' AND job_desc='Fumes'");
if ($result->num_rows == 1) {
$response = "";
foreach ($result as $row) {
$response .= '<span class="glyphicon glyphicon-print"></span>print button';
}
}
return json_encode([YOUREPREVIOUSRETRUN,$response]);
And then in ajax part you must parse json data first variable [YOUREPREVIOUSRETRUN] your previous data and second data you must put it on $("#job_desc").html(second data).
Or, you can use an iframe for this part but I don't suggest that.

From what I can tell by looking at the structure of your modal, you seem to be using Bootstrap, though I am unclear on the version. If it's Bootstrap 5, read on. If not, please add that information to your question, and let me know.
Here's how you can do it all in one call.
First, change the page from which you are opening the modal, so that the modal isn't a part of it. You need to make a separate file to hold the modal contents. Let's call that file remote-file.php. This would be inside that file.
<?php
// your PHP logic goes here - parse the received $_POST parameters, prepare your query - if needed, query your database
// retrieve the data, and place it in variables for later display
require 'conn.php';
$jvid = isset($_POST['jvid'] ? (int)$_POST['jvid'] : 0;
$result = $conn->prepare("SELECT job_desc FROM jobspervisit WHERE jvid = ? AND job_desc='Fumes'");
$result->bind_param("i",$jvid);
$result->execute();
if($result && $result->num_rows == 1) {
// row found, do stuff
$output = '<span class="glyphicon glyphicon-print"></span>print button';
} else {
$output = "Nothing found";
}
?>
<div class="modal-dialog">
<form method="post" id="job_form" enctype="multipart/form-data">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Jobs</h4>
</div>
<div class="modal-body">
<div id="show_inseredjobs"></div>
<br/>
<select name="job_desc" class="form-control action" id="job_desc" data-live-search="true" title="Select Job"></select>
</div>
<div class="modal-footer">
<input type="hidden" name="vis_id" id="vis_id" value="<?=$jvid?>">
<?php
echo $output;
?>
<input type="submit" name="action" id="action" form="job_form" class="btn btn-success" value="Προσθήκη" />
<button type="button" class="btn btn-default" data-dismiss="modal">Άκυρο</button>
</div>
</div>
</form>
</div>
Some notes about previous code:
it is assumed that jvid in your database is an INT type colum. Because of that, we could do (int)$_POST['jvid']
if jvid is not an INT but another type of column, we wouldn't do the (int)$_POST['jvid'] bit, and our binding would be slightly different
// prepare the query
$jvid = $_POST["jvid"];
$results = $conn->prepare("SELECT job_desc FROM jobspervisit WHERE jvid = ? AND job_desc='Fumes'");
$results = $conn->bind_param("s",$jvid);
$result->execute();
Next, in the original page, where your buttons are (and where your modal's HTML was), you would need this line of code for the modal.
<div class="modal fade" id="jobModal"></div>
This is going to be a wrapper for your modal content. All the rest will be going inside the remote-file.php. Also, your button element, the one that's opening the modal on click? That button doesn't need to have a data-bs-target attribute, because the following code will work (since you're using jQuery and all).
<button class="btn btn-lg btn-success add-task" id="btn" data-id="1234">Open modal</button>
<div class="modal fade" id="jobModal"></div>
<script>
$(document).ready(function() {
$(document).on('click', '.add_task', function(){
var user_id = $(this).attr("id");
$('#jobModal').load('remote-file.php',{'jvid':user_id },function(){
var jobModal = new bootstrap.Modal($('#jobModal')[0], {
backdrop:"static",
show:true
});
jobModal.show();
});
});
});
</script>
Final notes:
jQuery version: 3.6.3
Bootstrap version: 5.3.0

Error when sending variable from AJAX to PHP

I'm generating table rows with data from a database.
Below is my code:
<table class="table table-hover" id="dashEventTable">
<thead>
<tr>
<th>Created at</th>
<th>Seminar Name</th>
<th>Quota</th>
<th>Location</th>
<th>Option</th>
<th style="display:none"></th>
</tr>
</thead>
<tbody script="javascript">
<?php
$one = 1;
$Lihat="SELECT * FROM event where status = '$one'";
$Tampil = mysqli_query( $db, $Lihat );
while ( $hasil = mysqli_fetch_array ( $Tampil ) ) {
$id_event = ( $hasil['id_event'] );
$nama_event = ( $hasil['nama_event'] );
$lokasi = ( $hasil['lokasi'] );
$kuota = ( $hasil['kuota'] );
$created_at = ( $hasil['created_at'] );
{ ?>
<tr>
<td class="created_at"><?php echo date( 'Y-m-d h:i a', strtotime( $created_at ) ); ?></td>
<td class="event_name"><?php echo "$nama_event"; ?></td>
<td class="kuota"><?php echo "$kuota"; ?></td>
<td class="lokasi"><?php echo "$lokasi"; ?></td>
<td>
<a class="btn btn-xs btn-danger btn_delete" data-toggle="modal" href="#deleteDashEvent"><i class="fa fa-trash"></i></a>
</td>
<td class="event_id" style="display:none"><?php echo "$id_event"; ?></td>
</tr><?php }
} ?>
</tbody>
</table>
Now when I click on the button inside the rows, it does two things, the first is going to this JavaScript function:
$( ".btn_delete" ).click(function() {
var $row = $( this ).closest( "tr" ); // Find the row
var event_id = $row.find( ".event_id" ).text();
console.log( event_id );
$.ajax({
url: "contain_data.php",
method: 'post',
data: {
'send': event_id
},
success: function() {
alert( event_id );
}
});
});
From the alert and console log, I saw that I got the correct ID for the event id of the row. The data will then be sent to the PHP file above, and inside that PHP is this:
<?php
if ( isset( $_POST['send'] ) ) {
$id_event = $_POST['send'];
} else {
echo "The data has not been received!";
}
The second thing it does is go to this div for the delete confirmation:
<form action="admin_delete_event.php" enctype="multipart/form-data" id="event_delete_row" method="post" name="delete_event_row">
<div class="modal fade" id="deleteDashEvent">
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<div class="modal-header">
<button aria-label="Close" class="close" data-dismiss="modal" type="button">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Delete Confirmation</h4>
</div>
<div class="modal-body">
<p>Are you sure want to delete this event?</p>
</div>
<div class="modal-footer">
<a class="btn btn-default" data-dismiss="modal" href="#">Batal</a>
<button class="btn btn-primary btn_confirm_delete" name="admin_delete_event" type="submit">DELETE</button>
</div>
</div>
</div>
</div>
</form>
When the DELETE button is clicked, it will then go to this PHP file:
<?php
session_start();
include( "config.php" );
if ( isset( $_POST['admin_delete_event'] ) ) {
include( "contain_data.php" );
$zero = 0;
$delete_query = "UPDATE event, jadwal_acara, waktu_pendaftaran
SET event.status = '$zero', jadwal_acara.status = '$zero', waktu_pendaftaran.status = '$zero'
WHERE event.id_event = '$id_event'
AND jadwal_acara.id_event = '$id_event'
AND waktu_pendaftaran.id_event = '$id_event'";
if ( mysqli_query( $db, $delete_query ) ) {
$delete = "Data has been deleted";
echo $delete;
} else {
echo "Error: " . $delete_query . "<br>" . mysqli_error( $db );
}
} else {
echo "The button is not detected!";
}
The problem I am having is that I received this error when I click the delete confirmation button:
The data has not been received!
Undefined variable: id_event in...
Which means that I fail in sending the data.
What am I doing wrong and how can I resolve it?
EDIT: after adding error handling to the php file, the value sent by the ajax is null instead of the id_event, do you guys know why?

Update your AJAX With:
$.ajax({
url: "contain_data.php",
method: 'post',
data : 'send='+event_id,
success:function(){
alert(event_id);
}
});
try to pass your event_id using this way
data : 'send='+event_id,
because you have taken
method: 'post',
Hope it will help

I got your error . Upto submit your first form through is correct when you go for delete conformation you miss that event_id and you just using that one in you "admin_delete_event.php" file that why it giving error
Undefined variable: id_event in...
Now just add an hidden input field in form and submit it then the event_id will be available to you.
<form action="admin_delete_event.php" enctype="multipart/form-data" id="event_delete_row" method="post" name="delete_event_row">
<div class="modal fade" id="deleteDashEvent">
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<div class="modal-header">
<button aria-label="Close" class="close" data-dismiss="modal" type="button">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Delete Confirmation</h4>
</div>
<div class="modal-body">
<p>Are you sure want to delete this event?</p>
</div>
<div class="modal-footer">
<a class="btn btn-default" data-dismiss="modal" href="#">Batal</a>
<button class="btn btn-primary btn_confirm_delete" name="admin_delete_event" type="submit">DELETE</button>
</div>
</div>
</div>
</div>
<input type="hidden" name='event_id' value='id' id='event'>
</form>
And just change this in your 1st Ajax
$( ".btn_delete" ).click(function() {
var $row = $( this ).closest( "tr" ); // Find the row
var event_id = $row.find( ".event_id" ).text();
console.log( event_id );
$.ajax({
url: "contain_data.php",
method: 'post',
data: {
'send': event_id
},
success: function() {
$('#event').val(event_id);
alert( event_id );
}
});
});
Then it will work fine.

Yii2 - Using javascript to update a dynamic from element with wbraganca dynamicform

I have a dynamic form for Product Orders. I am setting the price based on company(select2) and product using onchange from the product dropDownList. Company is on the base form outside the dynamicform (easy to reference) but product is a list item within the dynamicform. My code is working for the first item but I cannot set the subsequent because I cannot figure out how to address the item # of the added dynamic form items.
dynamic form loop:
<?php foreach ($modelsOrderItem as $o => $modelOrderItem): ?>
<div class="item panel panel-default"><!-- widgetBody -->
<div class="clearfix"></div>
<div class="panel-body">
<?php
// necessary for update action.
if (! $modelOrderItem->isNewRecord) {
echo Html::activeHiddenInput($modelOrderItem, "[{$o}]id");
}
?>
<div class="pull-right">
<button type="button" class="add-item btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
<button type="button" class="remove-item btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
</div>
<div class="col-md-5">
<?= $form->field($modelOrderItem, "[{$o}]idProduct")->
dropDownList
(
ArrayHelper::map(Product::find()->all(), 'id','ProductCodeWithName'),
['prompt' => 'Select a Product','style'=>'width:400px' ,
'onchange' => '$.post( "index.php?r=pricelist/pricelist&idProduct='.'"+$(this).val()+"'.'&idCompany='.'"+$("#order-idcompany").val(),
function(data)
{
$( "#orderitem-0-itemprice" ).val(data);
});']
)->label(false);
?>
</div>
<div class="col-md-3" >
<?= $form->field($modelOrderItem, "[{$o}]itemQuantity")->textInput(['style'=>'width:150px'])->label(false) ?>
</div>
<div class="col-md-2">
<?= $form->field($modelOrderItem, "[{$o}]itemPrice")->textInput(['style'=>'width:200px'])->label(false) ?>
</div>
</div><!-- .row -->
</div>
</div>
<?php endforeach; ?>
I have now removed the onchange function and added Javascript that allows me to control which form element to change but, I cannot figure out how to do this with dynamically added elements. I have included script looking for a change in the added price element but the script does not get activated. So it works for the zero(0) element but will not respond with orderitem1, etc. Here is my updated code and the Javascript.
<div class="container-items"><!-- widgetContainer -->
<?php foreach ($modelsOrderItem as $o => $modelOrderItem):?>
<div class="item panel panel-default"><!-- widgetBody -->
<div class="clearfix"></div>
<div class="panel-body">
<?php
// necessary for update action.
if (! $modelOrderItem->isNewRecord)
{
echo Html::activeHiddenInput($modelOrderItem, "[{$o}]id");
}
?>
<div class="form-group kv-fieldset-inline">
<div class="col-sm-4">
<?= $form->field($modelOrderItem, "[{$o}]idProduct")->dropDownList
(
ArrayHelper::map(Product::find()->orderBy('productCode')->all(), 'id','ProductCodeWithName'),
['prompt' => 'Select a Product','style'=>'width:360px' ,]
)->label(false);
?>
</div>
<div class="col-sm-2" >
<?= $form->field($modelOrderItem, "[{$o}]itemQuantity")->textInput(['style'=>'width:100px','padding'=>'100px'])->label(false) ?>
</div>
<div class="col-sm-2" >
<?= $form->field($modelOrderItem, "[{$o}]quantityType")->DropdownList(['Cartons'=>'Cartons','Bags'=>'Bags','Kilograms'=>'Kilograms',
'Tubs'=>'Tubs', 'Pieces' => 'Pieces'],['style'=>'width:150px'])->label(false) ?>
</div>
<div class="col-sm-2">
<?= $form->field($modelOrderItem, "[{$o}]itemPrice")->textInput(['style'=>'width:200px'])->label(false) ?>
</div>
<div class="pull-right">
<button type="button" class="add-item btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
<button type="button" class="remove-item btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
</div>
</div>
</div><!-- .row -->
</div>
</div>
<?php endforeach; ?>
</div>
<?php DynamicFormWidget::end(); ?>
</div>
Javascript:
<?php
$script = "$('#orderitem-0-idproduct').change(function()
{
var idProduct = $(this).val();
$.get( 'index.php?r=pricelist/getpricelist&idProduct',{ idProduct:idProduct, idCompany:$model->idCompany },
function(data)
{
$('#orderitem-0-itemprice').val(data);
});
});
$('#orderitem-1-idproduct').change(function()
{
var idProduct1 = $(this).val(data);
alert();
$.get( 'index.php?r=pricelist/getpricelist&idProduct',{ idProduct:idProduct1, idCompany:$model->idCompany },
function(data)
{
$('#orderitem-1-itemprice').val(data);
});
});";
$this->registerJs($script);
?>

I was able to use Javascript to find out which element was being clicked. This avoided the problem of being able to run code on dynamic elements that had not been initiated.
<?php $js = <<<JS
$('body').change(function(e)
{
var element = '#'+$(e.target).attr('id');
var field = element.substring(element.length - number_of_chars_in_your_fieldname, element.length); //stripping the string to identify the field you are looking
if(field === "field_you_are_looking_for") //element usually looks like #formID-row-field
{
var dropdownID = $(element).val();
if (element.length === 22) //single digit row numbers
{
var row = element.substring(11,12); //extract the current row number
} else //row numbers higher than 9
{
var row = element.substring(11,13);
}
//Do whatever you need to do
$('#formID-'+row+'-field_you_want_to_change').val(data); //set the field to change on current row
}
});
JS;
$this->registerJs($js);
?>

myModal form opens on one page but when using the same id it won't open from the homepage

I am trying to make a donation form that is working good on a cause page also show when a user clicks a button in the header. From the cause page when I use the data-target '#CausemyModal2' it works fine, but when I add the '#CausemyModal2' ID to the data-target on the homepage button it won't open anything. However, on the homepage button if I set the data-target to '#myModal' it will open a form just not the one I want. The relevant parts of the files will be below. Many thanks, if I didn't include something that is needed please let me know and I will provide it.
Functions-theme.php(the form that doesn't)
<div class="right-header">
<?php if(isset($cs_theme_option['header_donation_button']) && $cs_theme_option['header_donation_button'] == 'on'){?>
<? php if($cs_theme_option['trans_switcher'] == "on"){ _e('Support us','WeStand');}else{ echo $cs_theme_option['donation_btn_title']; } ?>
page_cause.php(the form that works)
<span class="progress-box-left"><?php if($cs_theme_option['trans_switcher'] == "on"){ _e('Raised','WeStand');}else{ echo $cs_theme_option['cause_raised']; }?> <?php echo $cs_theme_option['paypal_currency_sign'];?><?php echo number_format($payment_gross);?></span>
</div>
<?php if( isset($cs_node->cause_view) && $cs_node->cause_view == "small" ){?>
<?php if(isset($cause_status) && $cause_status <> ''){
echo '<span class="btn cs-btn-donate cs-bgcolrhvr">'.$cause_status.' </span>';
} else {?>
<?php if($cs_theme_option['trans_switcher'] == "on"){ $trans_featured = _e('Donate Now','WeStand');}else{ echo $cs_theme_option['cause_donate']; }?>
<?php }?>
functions.php
if($cs_theme_option['trans_switcher'] == "on"){ $cause_donate = __('Donate Now','WeStand');}else{ $cause_donate = $cs_theme_option['cause_donate']; }
CausemyModal
?>
<div class="modal fade cs-donation-form" id="CausemyModal2<?php echo $cause_id;?>" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button aria-hidden="true" data-dismiss="modal" class="close" type="button"><i class="fa fa-times-circle"></i> </button>
<i class="fa fa-money"></i>
<h2><?php echo $cause_donate;?></h2>
</div>
<div class="modal-body">
<h4><?php if($cs_theme_option['trans_switcher'] == "on"){ _e('Donation via authorise.net from your visitors','WeStand');}else{ echo $cs_theme_option['header_support_button_text_heading3']; }?></h4>
<ul>
<?php
if(isset($cs_theme_option['paypal_payments']) && $cs_theme_option['paypal_payments'] <> ''){
$paypal_payments = $cs_theme_option['paypal_payments'];
$paypal_payments = explode(',',$cs_theme_option['paypal_payments']);
} else {
$paypal_payments = array('50','100','200','500','1000');
}
foreach($paypal_payments as $paypal_payments_value){
?>
<li><label class="cs-bgcolrhvr"><?php echo $cs_theme_option['paypal_currency_sign'].$paypal_payments_value;?> <input type="radio" name="donate" value="<?php echo trim($paypal_payments_value);?>"></label></li>
<?php }?>
</ul>
<script>
jQuery(document).ready(function($) {
jQuery(".cs-donation-form ul li label") .click(function(event) {
/* Act on the event */
var a = jQuery(this).text().substring(1);
jQuery(".cs-donation-form .modal-footer label .cause-amount") .val(a);
jQuery(".cs-donation-form ul li label").removeClass("cs-active");
jQuery(this).addClass('cs-active');
return false;
});
});
</script>
<div class="other-options">
<span class="opt-or">or</span>
</div>
</div>

I would not give id attribute to a form, for exactly the reason of this issue. The form fragment could be included on different pages, which may contain already an element with the same id. I would advise to give your form a name attribute and reference if by following JavaScript code:
var formName = "myDonationForm";
var form = document.forms[formName];

Yii autocomplete widget not working after ajax call

I included an autocomplete widget inside my view which initially(first page load) works fine and i make an ajax call to update the CListView inside my main page and thats where my autocomplete doesnt show completions(the input box is there but when the user type no suggestion is loaded)..i have seen a lot of issue about using renderPartial and ajax calls not working...anyone with a good solution or please suggest me..
here is my main view that is being refreshed by ajaxcall on the same page..
<div id="top" class="row-fluid" style="margin:0 30 auto 30; ;width:100%;">
<?php
?>
<div id="messages" style="width:35%!important;float:left;margin-left:100px;margin- right:20px!important;position:relative; overflow: hidden;">
<?php
$this->renderPartial('ajaxindex',array('dataProvider'=>$dataProvider),false,true);
?>
<!--end of portlet"-->
</div>
<!--end of messages-->
<div id="nav-panel" class="portlet" style="float:left!important;
width:40%!important;border:1px;box-shadow: 10px 10px 5px #888888;" >
<div class="panel panel-success portlet-decoration">
<!-- Default panel contents -->
<div class="panel-heading">
Filtering Panel >> Rwanda
</div>
</div>
<table class="table table-condensed">
<tr>
<th>Province</th>
<th>Critical</th>
<th>Attention</th>
<th>Normal</th>
<th>Nothing</th>
<th>error</th>
<th>count</th>
</tr>
<?php
$i=1;
$countNothing=0;
$countNormal=0;
$countAttention=0;
$countCritical=0;
$countError=0;
$countAll=0;
foreach($messagesByProvinces as $messagesByProvince){
$province=Province::Model()->findByPk($i);
$provinceParams=null;
$messageParams=null;
$critical=0;
$attention=0;
$normal=0;
$nothing=0;
$error=0;
$count=count($messagesByProvince);
foreach($messagesByProvince as $message){
$countAll++;
if($message->indice==0){
$nothing++;
$countNothing++;
}
elseif($message->indice==1){
$normal++;
$countNormal++;
}
elseif($message->indice==2){
$attention++;
$countAttention++;
}
elseif($message->indice==3){
$critical++;
$countCritical++;
}
else {
$error++;
$countError++;
}
}
if($filter!==null){
$provinceParams=array('message/getProvincereport','id'=>$province->id,'start_date'=>$filter['start_date'],'end_date'=>$filter['end_date']);
$messageParams=array('message/LoadMessages','province_id'=>$province->id,'start_date'=>$filter['start_date'],'end_date'=>$filter['end_date']);
}
else {
$provinceParams=array('message/getProvincereport','id'=>$province->id);
$messageParams=array('message/LoadMessages','province_id'=>$province->id);
}
echo "<tr><td>".CHtml::link($province->name,$provinceParams)."</td>
<td><span class='badge badge-important'>".CHtml::ajaxLink($critical,$this->associate('indice',3,$messageParams),array('update'=>'#messages','success'=>'js:function(data){
var $response=$(data);
var newData=$response.find(".container-fluid").html();
$("#messages").html(newData);
} '))."</span></td>";
Here is the view that is rendered in renderPartial
<script>
function showInput(id){
if(document.getElementById('message-body-'+id).style.display=='block')
document.getElementById('message-body-'+id).style.display='none';
else
document.getElementById('message-body-'+id).style.display='block';
;
}
</script>
<?php
/* #var $this MessageController */
/* #var $dataProvider CActiveDataProvider */
?>
<div id="portlet-messages" class="portlet" style="float:left!important;
width:100% !important;max-height:450px;overflow:auto;
overflow-x:hidden;" >
<div class="panel panel-primary portlet-decoration">
<!-- Default panel contents -->
<div class="panel-heading">
<i class="icon-envelope"></i> Messages
</div>
</div>
<table class="table table-striped">
<?php $this->widget('zii.widgets.CListView', array(
'dataProvider'=>$dataProvider,
'summaryText'=>'',
'enablePagination'=>false,
'itemView'=>'_ajaxview',
)); ?>
</table>
</div>
and the the embed view that contains the bogus code of from CAutoComplete Widget..
<?php
$indiceDisplay='Error';
$label="label-default";
if($data->indice==0){
$indiceDisplay="Nothing";
$label="label-info";
}
elseif($data->indice==1){
$indiceDisplay="Normal";
$label="label-success";
}
elseif($data->indice==2){
$indiceDisplay="Attention";
$label="label-warning";
}
elseif($data->indice==3){
$indiceDisplay="Critical";
$label="label-important";
}
else{
$indiceDisplay="Error";
$label="label-default";
}
echo "<tr class='view' >";
?>
<td>
<?php
echo CHtml::encode(User::Model()->findByPK($data->user_id)->names);echo "<br/></br>";
?>
</td>
<td>
<?php
echo "<b>";
echo CHtml::encode( date_format(new DateTime($data->date), 'g:ia \o\n l jS F Y'));?>
<?php
echo " ";
echo " ";
$linkText="<span class='label ".$label." '> ".$indiceDisplay." </span>";
echo CHtml::link($linkText,array('message/index','indice'=>$data->indice));
echo"</br>";
?>
</b>
</br>
<?php echo CHtml::encode($data->content); ?>
<br />
<?php
echo " <b>Location :</b> ".CHtml::link(Province::Model()->findByPk($data- >province_id)->name,array('message/index','province_id'=>$data->province_id))." ".Chtml::link(District::Model()->findByPk($data->district_id)- >name,array('message/index','district_id'=>$data->district_id))." ".CHtml::link(Sector::Model()->findByPk($data->sector_id)- >name,array('message/index','sector_id'=>$data->sector_id))." ".CHtml::link(Cell::Model()- >findByPk($data->cell_id)->name,array('message/index','cell_id'=>$data->cell_id))." ";
?>
<div id="results-<?echo $data->id;?>">
</div>
<?php echo "<div id='message-body-".$data->id."' style='font-size:12px;display:none;'>";?>
<div class="input-append">
<span>Add Category</span>
<?php $this->widget('CAutoComplete', array(
'model'=>$data,
'attribute'=>'category',
'url'=>array('message/suggestCategory'),
'multiple'=>true,
'htmlOptions'=>array('style'=>'height:11px;font-weight: bold;','maxlength'=>255,'value'=>$data->category,'id'=>'category-'.$data->id,))); ?>
<?php echo CHtml::ajaxSubmitButton('Save',$this- >createUrl('message/categorize',array('id'=>$data->id,'category'=>'js:function(){return $("#category-'.$data->id.'").val();}')),
array(
'type'=>'post',
'data'=>array('category'=>'js:function(){return $("#category-'.$data->id.'").val();}'),
'success'=>'function(data) {
if(data.status=="success"){
$("#results-'.$data->id.'").html(data);
$("#message-body-'.$data->id.'").style.display="none";
}
else{
$("#results-'.$data->id.'").html(data);
document.getElementById("message-body-'.$data->id.'").style.display="none";
}
}',
),array('id'=>'mybtn-'.$data->id,'class'=>'btn btn-small btn- primary','style'=>'height:21px'));
?>
</div>
</div>
</td>
<td>
<a class="btn btn-small" onclick="showInput(<?php echo $data->id;?>);"><i class="icon icon- edit"></i>
</a>
</td>
</tr>
here is the method that is called through the ajax call to update the message div in the main page posted at the begining of the code..
public function actionLoadmessages()
{ $criteria=$this->getCriteria();
if(isset($_REQUEST['indice'])){
$criteria->addCondition('indice=:ind');
$criteria->params['ind']=$_REQUEST['indice'];
}
$dataProvider=new CActiveDataProvider('Message',array('criteria'=>$criteria));
$this->layout=null;
$this->render('ajaxindex',array('dataProvider'=>$dataProvider));
}

You should apply post processing of javascript after the ajax call otherwise some javascript functions will not work ..
Your render call should be something like this
$this->renderPartial('ajaxindex',array('dataProvider'=>$dataProvider),false,true);
Refer this page for more info http://www.yiiframework.com/doc/api/1.1/CController#renderPartial-detail
You should also use renderPartial if updating a div only, render will call layout files as well.