Hi,
How do I disable the ajax validation for 1 model attribute?
Thanks.
Hi,
How do I disable the ajax validation for 1 model attribute?
Thanks.
The Navbar won’t apply class=“active” to my “home” page (url=’/’ or ‘/site/index’), am I missing something obvious?
Thanks!
Try using Yii::app()->homeUrl instead. That’s what I use.
Hi, Everyoner I Have Error…
Alerts
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 261904 bytes) in H:\xampp\htdocs\yii\framework\web\CWebApplication.php on line 365
Thanks
Can someone answer the above post please.
Also, on a vertical form the error class is not applied, is there a fix for this?
Thanks for all the help.
AjaxValidation is applied to ActiveForm and not to an individual form field thus you cannot just disable one attribute using ActiveForm (or BootsActiveForm). The key is how to define the attributes in validation rules of the model class. “safe” attributes will be validated by ajaxValidation - “unsafe” (not safe) will not. If you have different forms with different validation rules, you should try defining different scenarios. Here’s more information about safe attributes and scenarios. Hope, it helps!
Missing CSS:
This is a matter of a missing div and .control-group css class and you’re not the only one who’s asking. Here’s a ticket and ongoing discussion about it: Displaying errors in horizontal vs vertical vs inline forms vs the initial intention of bootstrap how to handle this and so on and on and blah!
In the meantime, if you want to fix this on your side just add the following to your stylesheet:
.form-vertical label.error, .form-vertical .error + .help-inline
{
color:#b94a48;
}
.form-vertical input.error, .form-vertical select.error, .form-vertical textarea.error {
border-color: #b94a48;
color: #b94a48;
}
.form-vertical input.error:focus, .form-vertical select.error:focus, .form-vertical textarea.error:focus {
border-color: #953b39;
-webkit-box-shadow: 0 0 6px #d59392;
-moz-box-shadow: 0 0 6px #d59392;
box-shadow: 0 0 6px #d59392;
}
Thank you very much for your reply.
I’ll try the CSS tomorrow.
About the validation, yes you can disable the ajax validation on 1 attribute.
Take a look at CActiveForm->error():
public function error($model,$attribute,$htmlOptions=array(),$enableAjaxValidation=true,$enableClientValidation=true)
I also have it working with bootstrap. If any one is interested on how I did it just ask and I’ll post it here.
Thanks again.
Hello
I am building a system where the user can edit personal settings anytime. This option is accessible from a link in a Navbar BootMenu. The new form should be available in a modal window using BootModal for such.
I could implement the following code in my main view:
...
<div class="modal-body">
<?php echo $this->renderPartial('_usersettings',array('model'=>$model)); ?>
</div>
...
But this is not good for performance as the _usersettings would get rendered for all the pages.
So I would like to know how can I get modal-body contents loaded with _usersettings view ONLY when modal window is opened.
Anybody can help me?
Thanks in advance,
A.Miguel
Hey Miguel,
Bootstrap’s modal doesn’t support loading content through an AJAX call so you would need to implement that yourself and that’s basically the only way to achieve what you described above.
Another option would be to reload the current page with the modal html and then display the popup but I wouldn’t probably do that.
Here’s a quick & dirty approach to your question. Scenario: A login link in bootNavbar/bootMenu opens a login modal (widget) and while opening the modal some additional content is being loaded into whatever div via jquery’s load().
Link in bootMenu:
array('label'=>'login', 'url'=>array('#'), 'active'=>false, 'visible'=>user()->isGuest, 'linkOptions'=>array('class'=>'', 'id'=>'showloginmodal'))),
Widget in (main) view:
$this->widget('UserLoginWidget', array('visible'=>user()->isGuest&&$this->action->id!=='login'));
Javascript to bind login link, open modal, and load ajax content:
//<![CDATA[
<script type="text/javascript">
$(document).ready( function()
{
...
$('#showloginmodal').bind('click', function() {
$('#loginmodal').modal('show');
$('#loginmodal #ajaxcontent').load('/user/ajaxcontent');
});
...
});
//]]>
</script>
Shortened view of modal widget (controller & view in components):
<?php $this->beginWidget('bootstrap.widgets.BootModal', array(
'id'=>'loginmodal',
));
...
<div class="modal-header">...</div>
<div class="modal-body">
<fieldset>
...
<div id="ajaxcontent"></div>
...
</fieldset>
</div>
<div class="modal-footer">...</div>
...
$this->endWidget(); ?>
AjaxAction in UserController:
public function actionAjaxContent()
{
$users = User::model()->findAll();
$data = array();
$data["users"] = $users;
$this->renderPartial('_ajaxContent', $data, false, false);
}
View of _ajaxContent.php in /views/users/:
<?php
<p>list of email addresses:</p>
foreach($users as $user) {
echo $user->email.'<br/>';
}
?>
Hope it helps!
-df
Give an example please of using "scrollspy". How it works on demo-site?
I’m having no luck with this extension, even though I’ve carefully followed the setup instructions.
I’ve unzipped the extension under protected/extensions/bootstrap.
Here is the code for my configuration file:
<?php
// uncomment the following to define a path alias
// Yii::setPathOfAlias(‘local’,‘path/to/local-folder’);
// This is the main Web application configuration. Any writable
// CWebApplication properties can be configured here.
return array(
'basePath'=>dirname(__FILE__).DIRECTORY_SEPARATOR.'..',
'name'=>'Bob Humphrey',
// preloading
[b]'preload'=>array('
log,
bootstrap,'),
[/b]
// autoloading model and component classes
'import'=>array(
'application.models.*',
'application.components.*',
),
'modules'=>array(
// uncomment the following to enable the Gii tool
'gii'=>array(
'class'=>'system.gii.GiiModule',
'password'=>'crazyheart',
// If removed, Gii defaults to localhost only. Edit carefully to taste.
'ipFilters'=>array('127.0.0.1','::1'),
[b]'generatorPaths'=>array(
'bootstrap.gii', [/b]// since 0.9.1
),
),
),
// application components
'components'=>array(
'user'=>array(
// enable cookie-based authentication
'allowAutoLogin'=>true,
),
// uncomment the following to enable URLs in path-format
'urlManager'=>array(
'urlFormat'=>'path',
'showScriptName'=>false,
'rules'=>array(
'<controller:\w+>'=>'<controller>/list',
'<controller:\w+>/<action:\w+>'=>'<controller>/<action>',
'<controller:\w+>/<id:\d+>/<title>'=>'<controller>/view',
'<controller:\w+>/<id:\d+>'=>'<controller>/view',
),
),
//'db'=>array(
// 'connectionString' => 'sqlite:'.dirname(__FILE__).'/../data/testdrive.db',
//),
// uncomment the following to use a MySQL database
'db'=>array(
'connectionString' => 'mysql:host=localhost;dbname=south421_bhoyii',
'emulatePrepare' => true,
'username' => 'south421_kfjgiep',
'password' => 'XP959b9HIsScCmSiJTTr',
//'username' => 'root',
//'password' => '',
'charset' => 'utf8',
),
'errorHandler'=>array(
// use 'site/error' action to display errors
'errorAction'=>'site/error',
),
'log'=>array(
'class'=>'CLogRouter',
'routes'=>array(
array(
'class'=>'CFileLogRoute',
'levels'=>'error, warning',
),
// uncomment the following to show log messages on web pages
array(
'class'=>'CWebLogRoute',
),
),
),
[b]'bootstrap'=>array(
'class'=>'ext.bootstrap.components.Bootstrap', // assuming you extracted bootstrap under extensions
),[/b]
),
// application-level parameters that can be accessed
// using Yii::app()->params['paramName']
'params'=>array(
// this is used in contact page
'adminEmail'=>'rphumphrey@gmail.com',
),
);
When I try to add the following code to my main layout, I get the error:
[b]
Alias "bootstrap.widgets.BootMenu" is invalid. Make sure it points to an existing directory or file. [/b]
<?php $this->widget('bootstrap.widgets.BootMenu', array(
'type'=>'tabs', // '', 'tabs', 'pills' (or 'list')
'stacked'=>false, // whether this is a stacked menu
'items'=>array(
array('label'=>'Home', 'url'=>'#', 'active'=>true),
array('label'=>'Profile', 'url'=>'#'),
array('label'=>'Messages', 'url'=>'#'),
),
)); ?>
Try this:
'preload'=>array(
'log',
'bootstrap', // preload the bootstrap component
),
In the following scenario there’s a sub navigation that links to several “sections” of the copy text inside your body. Of course, you can use different html elements as well.
.subnav (in view file)
<div class="subnav">
<ul class="nav nav-pills">
<li><a href="#one">One</a></li>
<li><a href="#two">Two</a></li>
<li><a href="#three">Three</a></li>
</ul>
</div>
setting the id’s (in view file)
<section id="one">...</section>
<section id="two">...</section>
<section id="three">...</section>
javascript (at bottom of view file)
<script type="text/javascript">
$('body').attr('data-spy', 'scroll');
$('body').attr('data-target', '.subnav');
$('body').attr('data-offset', '90');
$(document).ready( function(){
$('body').scrollspy();
...
});
</script>
If you’re using the latest yii-bootstrap extension that includes bootstrap.min.js instead of separate files, then fine. If you’re using older versions, then you may still need to manually register bootstrap-scrollspy.js.
Make sure:
class name of sub navigation is used as value of data-target
hash targets are set as id’s in various html tags; you can use <section>, <div>, or even <body id=“top”>
note: when you’re using a hash target without setting the id or misspelling it, there will be a javascript error and some js functions will not work anymore.
Instead of “$(‘body’).attr()” you can do the following (in main layout instead of view file):
<body data-spy="scroll" data-target=".subnav" data-offset="40">
Oh, data-offset is only needed if there’s a fixed navigation bar on top of page (here: navbar’s height is 90 pixel); and then it only takes care of the activation of the links while scrolling. You still need to play around with extra padding to make clicked sections appear right below and not under/behind the fixed navigation; for instance: The fixed navigation bar on top has a height of 90pixel; clicked section will appear 10px below the navbar and sections have a padding of 40pixel between each other, plus on top/bottom of first/last element. (Not quite sure how this looks on IE)
section {
padding-top: 100px;
margin-bottom: -60px;
}
section.first-section {
margin-top: -60px;
}
section.last-section {
margin-bottom: 40px;
}
Hope it helps and I’m not missing anything…
Thanks for replay, Don.
But I think BootMenu widget registers plugin by itself. It has "scrollspy" property.
[html]<h2 id="tech">Технические характеристики</h2>
<h2 id="option">Настройки приложения</h2>
<h2 id="user">Меню пользователя</h2>[/html]
<div class="span3 well subnav" style="position:fixed;top:70px;right:20px;">
<?php $this->widget('bootstrap.widgets.BootMenu', array(
'type'=>'list',
'scrollspy'=>array(
'spy'=>'.subnav',
'offset'=>'70',
),
'items'=>array(
array('label'=>'Оглавление'),
array('label'=>'Технические характеристики', 'url'=>'#tech', 'active'=>true),
array('label'=>'Настройки приложения', 'url'=>'#option'),
array('label'=>'Меню пользователя', 'url'=>'#user'),
),
)); ?>
</div>
Extension documentation says nothing about "scrollspy". And it works not properly on my page.
So do I have to configure it manually anyway?
Wow! I did not know that hence my “manual” approach - maybe this option is quite new to BootMenu and not ready yet. I’ve tried a few things and the only way it seems to work is putting another div around the widget:
<div class="subnav">
<?php $this->widget('bootstrap.widgets.BootMenu', array( ... )); ?>
</div>
Setting the "subnav" as classname and additional htmlOptions of BootMenu does not work, unfortunately. This is because of the following code fragment in bootstrap-scrollspy or bootstrap[.min].js:
this.selector = (this.options.target
|| ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, ''))
|| '') + ' .nav li > a'
Note the extra blank in front of “.nav”! So it wouldn’t work when having “subnav” as additional classname in the ul-tag and it needs to be the classname of a parent (div-) tag.
i Install bootstrp and follow the setup i got this error using the menu…
Alias "bootstrap.widgets.BootNavbar" is invalid. Make sure it points to an existing directory or file.
C:\yii\framework\YiiBase.php(343)
331 unset(self::$_includePaths[$pos]);
332 }
333
334 array_unshift(self::$_includePaths,$path);
335
336 if(self::$enableIncludePath && set_include_path(’.’.PATH_SEPARATOR.implode(PATH_SEPARATOR,self::$_includePaths))===false)
337 self::$enableIncludePath=false;
338
339 return self::$_imports[$alias]=$path;
340 }
341 }
342 else
343 throw new CException(Yii::t(‘yii’,‘Alias “{alias}” is invalid. Make sure it points to an existing directory or file.’,
344 array(’{alias}’=>$alias)));
345 }
346
347 /**
348 * Translates an alias into a file path.
349 * Note, this method does not ensure the existence of the resulting file path.
350 * It only checks if the root alias is valid or not.
351 * @param string $alias alias (e.g. system.web.CController)
352 * @return mixed file path corresponding to the alias, false if the alias is invalid.
353 */
354 public static function getPathOfAlias($alias)
355 {
this is my config/main.php
return array(
'basePath'=>dirname(__FILE__).DIRECTORY_SEPARATOR.'..',
'name'=>'My Web Application',
// preloading 'log' component
'preload'=>array(
'log',
'bootstrap', // preload the bootstrap component
),
'import'=>array('bootstrap'),
// autoloading model and component classes
'import'=>array(
‘application.models.*’,
‘application.components.*’,
‘application.extensions.bootstrap.widgets.*’,
),
'modules'=>array(
// uncomment the following to enable the Gii tool
'gii'=>array(
'class'=>'system.gii.GiiModule',
'password'=>'123',
// If removed, Gii defaults to localhost only. Edit carefully to taste.
'ipFilters'=>array('89.200.99.100','::1'),
),
),
// application components
'components'=>array(
'user'=>array(
// enable cookie-based authentication
'allowAutoLogin'=>true,
),
'components'=>array(
'bootstrap'=>array(
'class'=>'ext.bootstrap.components.Bootstrap', // assuming you extracted bootstrap under extensions
),
),
For an example on how to use the scrollspy with BootMenu I’d suggest that you take a look at the Yii-Bootstrap demo application found at: https://bitbucket.org/Crisu83/yii-bootstrap/src/62542c709dff/demo
The menu on the right (found at the bottom of site/index) "spies" on the body element. I hope this helps.
It would have helped a lot some time ago… and I do feel a little bit embarrassed that I hadn’t have checked the source files from the get-go. I believe the “scrollspy” is worth mentioning in the main documentation. It’s such a great feature if you just know how and then it saves a lot of time; but if you don’t know, it can be quite tricky to figure it out. Of course, a quick look at the source file makes a huge difference.
Thanks again for the link.
BootAlert
Hi, I have a couple of questons about BootAlert.
How to remove the ‘X’ (close) from the alert?
Hot to add a icon to the alert?
Also:
BootNavBar: How to change the bar’s color?
Thank you!