I am trying to build up a dynamic dropdownlist elements using ajax i.e. the user selects in the first dropdownlist the State and the second dropdownlist will get loaded with the list of Cities for the selected State.
class Employee extends CActiveRecord
{
...
public function relations()
{
return array(
...
'city' => array(self::BELONGS_TO, 'City', 'city_id'), )
}
}
class City extends CActiveRecord
{
...
public function relations()
{
return array(
...
'state' => array(self::BELONGS_TO, 'State', 'state_id'),
)
}
}
To the employee creation form I need to add two fields for each dropdownlist elements. Since city_id belongs to Employee model we obviously will need:
<?php echo $form->dropDownListRow($model(),'city_id', CHtml::listData(Site::model()->findAll(),'id','name'), array('prompt'=>'Select one item...')); ?>
The problem is on the state field, which doesn’t belong to Employee model. Actually state field should be inherited from CHtml (CHtml.dropDownList()) class rather than CActiveForm (CActiveForm.dropDownList()). Using Bootstrap dropDownListRow element we are always targeting for a CActiveForm element.
This is in fact a Bootstrap related question; please read carefully my topic.
The main point behind my question is that I cannot use any bootstrap method to build up a dropdownlist that is not directly related with the model i.e. a CHtml object. If you notice dropDownListRow is a bootstrap method that will execute the following:
This requires a model instance whereas CHtml not. In my example just the city field is directly related with the Employee model whereas State is not.
I’ve tried to enhance Bootstrap in order to include CHtml approach (see code below) but ended with no success because $model is required although the extension:
I have a Account and User model,(user has 1 account) and on the account view page, I am trying to display a text field with the full name of the user, the user model has firstname and lastname. How can I do that without having to define fullname in a model? And just combine the 2 on the view page.
I know this works with CHtml texfield, but I really want to use Boostrap.
I’m afraid you would have exactly the same problem without Bootstrap as far as I can tell. Instead of using the standard Bootstrap $form->dropDownListRow function (or the Bootstrap less $form->dropDownList), you just need to use the CHtml::dropDownList($this->attribute,’’, $this->data, $this->htmlOptions); way directly in your page.
You don’t really need to use the Bootstrap extension functions, you can just build the structure yourself like you do in this code:
echo '<div class="control-group">';
echo '<label for="State" class="control-label required">State <span class="required">*</span></label>';
echo '<div class="controls">';
echo CHtml::dropDownList('StateList','', State::getStates(),array(
'ajax' => array(
//'type'=>'POST', //request type default GET
'dataType'=>'json',
'url'=>CController::createUrl('City/getCitiesByStateId'), //url to call.
'update'=>'#Employee_city_id', //selector to update
//'data'=>'js:javascript statement'
'data'=>array('stateId'=>'js:this.value'),
//leave out the data key to pass all form values through
//http://www.yiiframework.com/wiki/24/
),
'empty' => '---'
));
echo '</div>';
You might have a problem with validation this way though (there will be none on the State field). If you need that, you will have to add a “State” property to your model (just put: public $state = ‘’; in your model), which you can then use in your validation rules etc.
Actually that would also allow you to use the Bootstrap extension and normal form functions (as this will make "State" part of your model as if it would be in your table), so this will probably be the easiest (and best) solution for you. Your Employee model will then actually have a "State" property.
@A.Miguel & jasocl: The extension doesn’t currently support building forms without a model, this is because I hardly ever build forms using plain CHtml elements because it’s not very dynamic and the validation becomes a lot more tricky. I’d suggest that you modify your model by adding the attribute that you need for the dropdown or build the form yourself without the use of Bootstrap’s widgets as Xuntar suggested.
@Fredi: Upgrade to the latest beta release and you won’t have a problem anymore. In 0.9.11 BootButton creates a button instead of an input when creating a submit button.
@Surlac: You are correct, PHP 5.4 will give a warning in that case. I need to change the code to make sure that it’s an array before using it as one. Thanks for reminding me about this.
Sorry guys, how do you make the current tab stay in focus after page submission? (using partial-rendering for content) or it’s only possible by using tab -> Ajax load method?
What I’d like to achieve is to have white icons only on active item. By default active pills are blue and black icon doesn’t look as that good as white one. ActiveCssClass is not parameter in BootMenu widget. If someone already solved this please let me know.
I had a problem with less files integration and render in IE8.
I solved the issue in IE8 removing all comments in bootstrap less files (include all less files imported by bootstrap.less file) and it rendered fine in IE8.
I don’t know if it was the right way to correct it, but in this case seems to be working.