CHtml Text field

Hi Friends,

How to pass current textfield "ID" value to javascript function ?

In my form i am having multiple rows with textfields. I am having a scenario to calculate the total cost based on other two text fields. I am thinking of passing the current textfield id value to identify the row from where i need to get value for calculation and update. I am trying in the below way but i could not make it work. If anyone have suggestions , help me on this issue.

Thanks in advance.

echo CHtml::textField('total_trip[]','',array('size'=>10,'maxlength'=>8,'onblur'=>'js:calTotalTripCost($(this).attr(\"id\"))'));

I’m not sure I have completely understood you, but by the looks of things you are manually creating text fields (not activeTextFields from a model) that you then want to sum in a javascript function.

If this is the case, first of all, unobtrusive javascript patterns would dictate that you don’t use the onblur attribute, but rather that you attach a blur event handler to the particular element afterwards.

So for this, I would simply suggest that you manually set the id for the textfields (by including "id" => "elementId" in the htmlOptions array for the textfield), and then register a javascript function (Yii::app()->getClientScript()->registerScript) for the appropriate event using the id you assigned to the textfield.

Thanks for your reply . Can you pass me some skeleton code ?

Well I’m still not sure exactly what it is you want to calculate, but as an example, I’ll assume that you are actually using activetextfields from a model for your values and adding one for your total (so $form is a CActiveForm instance):

$totalId = 'tripTotal';

echo $form->textField($model, 'attribute1');

echo $form->textField($model, 'attribute2');

echo CHtml::textField('tripTotal','',array('size'=>10,'disabled' => 'disabled', 'id' => $totalId));

Yii::app()->getClientScript()->registerScript('tripTotalCalculator', 

    'function updateTripTotal() {

        $(\'#'.$totalId.'\').val(parseFloat($(\'#'.CHtml::getActiveId($model, 'attribute1').'\').val()) + parseFloat($(\'#'.CHtml::getActiveId($model, 'attribute2').'\').val()));

    }', 

CClientScript::POS_HEAD);

Yii::app()->getClientScript()->registerScript('tripTotalUpdater', 

    '$(\'#'.CHtml::getActiveId($model, 'attribute1').', #'

    .Chtml::getActiveId($model, 'attribute2')

    .'\').die(\'blur.calculator\').live(\'blur.calculator\', function() { updateTripTotal(); });', 

CClientScript::POS_READY);

So you use your model fields as usual, add your total textfield (which I have disabled since presumably it will only be calculating automatically, not actually accepting any user input), then you register two scripts - the first one registers the function for updating the total with the values from our two model fields, and the second one binds an event handler to those two model fields to trigger this update whenever they lose focus.

Thanks a lot for your time. In my form, i am having array of text fields with id value generated automatically(By using cloning i am doing that). For example, like the below.

Row1 trip_unit_cost[] total_trip[] total_trip_cost[]

Row2 trip_unit_cost[] total_trip[] total_trip_cost[]

Row3 trip_unit_cost[] total_trip[] total_trip_cost[]

echo CHtml::textField('trip_unit_cost[]','',array('size'=>10,'maxlength'=>8,'readOnly'=>'readOnly'));

echo CHtml::textField('total_trip[]','',array('size'=>10,'maxlength'=>8,'onblur'=>'calTotalTripCost(\'js:$(this).attr("id")\')'));


echo CHtml::textField('total_trip_cost[]','',array('size'=>10,'maxlength'=><img src='http://www.yiiframework.com/forum/public/style_emoticons/default/cool.gif' class='bbc_emoticon' alt='8)' />);

I can’t use CHtml::activeID method to retrieve the id’s since i am not using model in the textfield. Something i need to retrieve the current row id and pass it to javascript function. Any suggestions ?

Glad news ! I solved it by following the below approach.

<script>


function calTotalTripCost(obj)

{


	

	var trip_unit_cost_id = "trip_unit_cost";


	var total_trip_id = "total_trip";


	var total_trip_cost_id = "total_trip_cost";


	var id_val = $(obj).attr("id");


	var last_numeric_id_val = id_val.match(/\d+/);


	if(last_numeric_id_val != null)

	{


		trip_unit_cost_id = trip_unit_cost_id+last_numeric_id_val;

		total_trip_id = total_trip_id+last_numeric_id_val;

		total_trip_cost_id = total_trip_cost_id+last_numeric_id_val;

		

	}


	var tripUnitCost = $("#"+trip_unit_cost_id).val();

	var totalTrip = $("#"+total_trip_id).val();	


	var totalTripCost;


	if(tripUnitCost != '' && totalTrip != '')

	{


		totalTripCost = tripUnitCost*totalTrip;

	}

	else

	{

		totalTripCost = 0;

	}	


	$("#"+total_trip_cost_id).val(totalTripCost);	

	

}




				<?php


					

					echo CHtml::textField('total_trip[]','',array('size'=>10,'maxlength'=>8,'onblur'=>'calTotalTripCost($(this))'));

						

				?>

Thanks a lot !

Ok, still not completely sure what you’re doing, but glad you solved it.

Hello can anyone help me. I have a listbox. I want to add the selected items of listbox to the dropdownbox. means the numbers of items in drop down must be same as the selected items in the listbox. Its very urgent please help me.