update form field with js but not showing in submitted data - javascript

Experimenting with JsHelper in CakePHP 2.0, I got a Request method to update the value of a form field with the results of an AJAX call - so far, so good. However, on inspecting the form field it says:
<input type="hidden" id="JobsPartUnitcost" name="data[JobsPart][unitcost]">5.55</input>
but when I copied it and first pasted it above it said
<input type="hidden" id="JobsPartUnitcost" name="data[JobsPart][unitcost]"></input>
and when I submitted the form the value was empty. Why is the browser showing the value but the underlying DOM not registering it?
Using Mac/Safari, CakePHP 2.0, JQuery
EDIT
As requested here is form data dump
Array ( [JobsPart] => Array ( [job_id] => 1 [company_id] => 4 [part_id] => 2 [qty] => 3 [unitcost] => ) )
and here is AJAX code
$this->Js->get('#JobsPartPartId')->event('change',
$this->Js->request(
array(
'controller'=>'JobsParts',
'action'=>'getPart'
),
array(
'update'=>'#JobsPartUnitcost',
'async' => true,
'method' => 'post',
'dataExpression'=>true,
'data'=> $this->Js->serializeForm(array(
'isForm' => false,
'inline' => true
))
)
)
);

You need to set the value attribute:
<input type="hidden" value="YOUR VALUE HERE" name="data[Etc][field]" />
You don't wrap a value in input tags.

OK. I have found a workaround and no one else seems to have found a direct solution.
In my static view I now have just <td id="part"></td> where the input field was. My Ajax call now updates '#part' and my dynamic view (the one called by the controller ajax action) now outputs the whole field - <?php echo $this->Form->input('unitcost', array('type' => 'text', 'value' => $part['Part']['costamount'])); ?>. Ugly but it works.

$this->Js->get('#JobsPartPartId')->event('change',
$this->Js->request(
array(
'controller'=>'JobsParts',
'action'=>'getPart'
),
array(
'success'=>'$("#JobsPartUnitcost").val(data)',
'async' => true,
'method' => 'post',
'dataExpression'=>true,
'data'=> $this->Js->serializeForm(array(
'isForm' => false,
'inline' => true
))
)
)
);

Related

Convert Yii1 code to Yii2 (changing language part)

i have a problem. I have a code where i can i change my site language, it's on Yii1
echo CHtml::ajaxLink('EN', array('/'), array(
'type' => 'POST',
'success' => 'js:function(res){window.location.reload();}',
'data' => array(
Yii::app()->request->csrfTokenName => Yii::app()->request->csrfToken,
'_lang' => 'en',
)
), array('class' => 'lang_class'));
Please help me to convert it ti Yii2, i dont get it at all.... cause i'm new at it.
Thank you!!!
Well in Yii2 there isn't ajaxLink anymore. So you can do it like this:
First set your link:
Html::a('Link title', 'javascript:void(0);', ['class' => 'changeLangLink']);
After that set js click event to the button and call your ajax.
$('.changeLangLink').click(function(e){
//do you ajax request
alert('Clicked');
});

Set a twig value with JS

I've seen many topics about questions like mine, but I can't get any solutions.
I'm using Symfony, and I have a twig template which displays a form.
Imagine that I have this line :
{{ form_row(demandeForm.distinction) }}
Thanks to this :
->add('distinction',null, [
'label_attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
I also have a submit button. My wish is to modify the value of my row "distinction" when the button is clicked (id of the submit button : formDepot).
Here is my code :
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').value('555');
});
});
When I retrieve my datas on submit, I don't have any value in my "distinction".
Any ideas ?
Thanks
This is because you're applying the changes on the label value, not on the input itself.
'label_attr' => array('id' => "distinct_form") and in js : $('#distinct_form').val('555');
Change the form builder to this :
->add('distinction',
null,
[
'attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
With attr for the field (not the label), you can try
$('#distinct_form').val('555'); not .value();
You are assigning a value, instead of getting the value, try this .....
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').val();
});

Yii2: Get values to update form in modal window

I am using Yii2 modal to update a form in modal window but I am unable to fetch the values to be already filled in the form.
In this screen-shot link below:
http://awesomescreenshot.com/0f957qq367
When I click on edit option, It takes me to the update form which is opened in a modal window. But this form shows empty values in all fields. I want to update the form.
Please find this in this screen-shot below:
http://awesomescreenshot.com/0f257qqscb
This is the snippet for what I have tried yet:
<?php
use yii\bootstrap\Nav;
use yii\bootstrap\Modal;
Modal::begin([
'id'=>'modalEdit',
//'header' => '<h2>Hello world</h2>',
'size'=> 'modal-lg',
//'toggleButton' => ['label' => 'click me'],
]);
$newmodel = new Backlog();
// $newmodel->id;
echo $this->render('/backlog/update', ['model' => $newmodel]);
Modal::end();
echo Nav::widget([
'options' => ['class' => 'nav-pills navbar-right'],
'encodeLabels' => false,
'items' => [
['label' => '', 'items' => [
['label' => '<span data-toggle="modal" data-target="#modalEdit" style="cursor: pointer;">Edit</span>','url' => 'javascript:void(0);'],
'<li class="divider"></li>',
['label' => '<span>Assign</span>', 'url' => ['#']],
'<li class="divider"></li>',
['label' => '<span>Convert To Backlog</span>', 'url' => ['#']],
'<li class="divider"></li>',
['label' => '<span>Close</span>', 'url' => ['#']],
]],
],
]);
if Backlog is an ActiveRecord Replace the Line with this.
$newmodel = Backlog::findOne(['ID'=>$id]);
Finally, I solved the problem using javascript and ajax loading :
$(document).on("click",".edit-backlog",function(e){
var back_l_id=$(this).attr("b-id");
var modal_body=$("#modalEdit").find(".modal-body");
$.ajax({
url:getAjaxUrl('backlog','update'),
data:{'id':back_l_id},
success:function(res){
//console.log(res);
modal_body.html(res);
}
});
});
I added a class .edit-backlog to span and get the id ("b-id") and used in the above script. Hope this answer helps others too.

Yii: Javascript & CSS not loading after Ajax calls

I have created a view with tabs and each tab has a form with ajax submit and gridview. I am using renderpartial in tabs widget to render the form and gridview and after clicking submit it filters the gridview. Everything looks fine within the tab till I click the submit button. After clicking submit it filters the gridview as expected.. but it does not load the bootstrap javascript and css so the layout is totally messed up and the tabs and menu bar all appears as a list and the page keeps on loading.
Anyone know why is it not loading the required scripts and css which I have preload in main config. Do I have to specify something seperately when calling ajax function from a view.
EDIT: Code Added
Code for tabs widget(producers.php)
<?php $this->widget(
'bootstrap.widgets.TbTabs',
array(
'type' => 'tabs',
'tabs' => array(
array('label' => 'Monthly' ,'id' => 'tab1',
'content' => $this->renderPartial('_prod_monthly',array('dataProvider' => $dataProvider,'dataProvider2' => $dataProvider2 ,'dataProvider3' => $dataProvider3, 'opm' => $opm, 'month' => $month),true,true),
'active' => true),
array('label' => 'Weekly' ,'id' => 'tab2',
'content' => $this->renderPartial('_prod_weekly',array('dataProvider4' => $dataProvider4,'dataProvider5' => $dataProvider5 ,'dataProvider3' => $dataProvider3, 'opm' => $opm, 'week' => $week),true,true)),
array('label' => 'Daily', 'id' => 'tab3', 'content' => 'ABC' )),
)); ?>
Code for partial view (_prod_monthly.php):
$form = $this->beginWidget(
'bootstrap.widgets.TbActiveForm',array(
'id' => 'form_monthly',
'enableAjaxValidation'=>true,
'type' => 'inline',
'method' => 'get',
'htmlOptions' => array('class' => 'well','onsubmit'=>"return false;",/* Disable normal form submit */
'onkeypress'=>" if(event.keyCode == 13){ send2(); } " /* Do ajax call when user presses enter key */),)); ?>
Select Month:
<?php echo CHtml::dropDownList('month', $month,
$sel_month); ?>
Select Employee:
<?php echo CHtml::dropDownList('opm', $opm,
$sel_opm); ?>
<?php $this->widget('bootstrap.widgets.TbButton',
array(
'buttonType'=>'button',
'label'=>'Submit',
'type' =>'primary',
'htmlOptions'=> array('onclick' => 'send2()'),)
);
$this->endWidget();
$this->widget('bootstrap.widgets.TbExtendedGridView', array(
'sortableRows'=>true,
'afterSortableUpdate' => 'js:function(id, position){ console.log("id: "+id+", position:"+position);}',
'type'=>'striped bordered hover',
'dataProvider'=>$dataProvider,
'type'=>'striped bordered responsive',
'template' => "{summary}\n{items}\n{extendedSummary}\n{exportButtons}"));?>
<script type="text/javascript">
function send2()
{
var data=$("#form_monthly").serialize();
$.ajax({
type: 'GET',
url: '<?php echo Yii::app()->createAbsoluteUrl("op/producers"); ?>',
data:data,
success:function(data){
document.write(data);
},
error: function(data) { // if error occured
alert("Error occured.please try again");
alert(data);
},
dataType:'html'});
}
</script>
Thanks.
There is no Yii based solution for handling UI-Widgets with AJAX right now and will never come.
Probably, this will never happen again in Yii2. The main Problem is about your missing JS-Ressources and Binding (as you know already). Yii will generate those codes (which you are missing) within the layout process, which is not called on "AJAX"-Requests. Don't try to put in your JS-Ressources by yourself. Yii generated JS-Cods are realy tricky ... and not that easy to handle manualy. This will come up with a lot of problems.
My solution: I dont use any of the "UI"-Features included in Yii. They come along with a lot of problems (Ajax, Multiple announces, etc.). Its not hard to write that features yourself or using jQueryUI.
Take a look at the Tab feature and try write it yourself .. and be happy ! :)

Get value of selectbox with JsHelper in CakePHP

I have a select box, and I want to use it to Ajax-update some other content on the page. So I have bound an event handler using the JsHelper (jQuery) like so:
<?php
echo $this->Form->select('car', $cars);
$this->Js->get("#car");
$this->Js->event('change', $this->Js->request(array(
'controller' => 'cars',
'action' => 'view',
???,
array('async' => true, 'update' => '#car-view', 'evalScripts' => true),
true
));
?>
But how can I get the value of the select box to send as an argument to the cars controller (at "???" in the code above)?
I could do everything in javascript, but is there any way to do this in cake?
To be honest, I struggled with this a while back. I couldn't find anything that worked, so I ended up just going the straight javascript route.
I think you are looking for this:
$this->Js->get('#selectbboxid1')->event('change',
$this->Js->request(array(
'action' => 'function'), array(
/*'before' => 'showLoader();',
'success' => 'hideLoader();',*/
'update' => '#selectboxid2',
'dataExpression'=>TRUE,
'method'=>'POST',
'async'=>TRUE,
'data' => $js->serializeForm(array('isForm' => TRUE, 'inline' => TRUE)) )));

Categories