I need to trigger link from CListView when change selected value in dropdownlist.
$(function () {
$(".dd").change(function(){
$('.title').trigger('click');
});
});
<div class="dd">
<?php echo CHtml::dropDownList('title', '', $RawData); ?>
</div>
//view for CListView
<div class="title" id="">
<?php echo CHtml::link(CHtml::encode($data->naslov), Yii::app()->request->baseUrl.'/one/two?id1='.$data->id2.'&id2='.$data->id2 ?>
</div>
OK, I solved the problem
$(function () {
$(".dd").change(function(){
var valString = $(".dd option:selected").val();
var link = $('#titID_'+valString+' a').attr('href');
//alert(link);
$('#titID_'+valString).bind('click', function() {
window.location.href = link;
return false;
});
$('#titID_'+valString).trigger('click')
});
});
Related
i've been trying to learn yii recently and so i started to work on an simple form with bootstrap. im using yii 1.1.x version not version 2 so i had to install bootstrap manually and write coding based on it.
anyway coming back to the problem it seems that my has-success class is being called correctly by jquery but it does'nt seem so for the has-error...
can someone help and im grateful for your help
<script>
$(document).ready(function() {
$('#contact_name').on('input', function() {
var input = $(this);
var is_name = input.val();
if (is_name) {
$('#contact_name').removeClass("has-success").addClass('has-error');
} else {
$('#contact_name').removeClass("has-error").addClass('has-success');
}
});
});
</script>
<h1>Example Form Validation</h1>
<br>
<div class="form " id="cla">
<?php $form=$this->beginWidget('CActiveForm',array( 'id' =>'form','htmlOptions'=> array('class'=> 'form-horizontal', 'name' => 'forvalidate', 'id' => 'registration-form' ))); ?>
<?php echo $form->errorSummary($model); ?>
<div class="row">
<div class="form-group col-lg-5" id='contact_name'>
<?php echo $form->label($model,'name',$htmloptions = array('class'=>'control-label ',)); ?>
<div class="controls">
<?php echo $form->textField($model,'name',array('name' =>'name' ,'class'=>'form-control col-xs-5', 'aria-describedby'=>'inputSuccess4Status')); ?>
</div>
</div>
</div>
<?php $this->endWidget(); ?>
</div>
<!-- form -->
Try
$('#contact_name').on('input', function() {
var input = $(this);
var is_name = input.val();
if (!is_name) {
$('#contact_name').parent().removeClass("has-success").addClass('has-error');
} else {
$('#contact_name').parent().removeClass("has-error").addClass('has-success');
}
});
I think "has-error" and "has-success" classes don't apply directly on the input but the div where the inputs are
You have to add these classes. See the highlighted code below:
$(document).ready(function() {
$('#contact_name').on('input', function() {
var is_name = $(this).val();
if (is_name) {
$('#contact_name').removeClass("has-success").addClass('has-error');
// ^^^^^^^^^^^^^^^^^^^^^^^
} else {
$('#contact_name').removeClass("has-error").addClass('has-success');
// ^^^^^^^^^^^^^^^^^^^^^^^^
}
});
});
Hi I ‘d like some help please, as my skills in jQuery are not so good. What I want to achieve is to change the order of the images like this example.
My database looks like this:
table: Gallery
img_id (pk)
image
caption
order
I have also created these 2 views:
index.php
<!-- will display the ajax result -->
<div id="orderResult"></div>
<hr/>
<input type="button" id="save" value="Save Order" class="btn btn-primary">
<script type="text/javascript">
$(function () {
$.post('<?php echo site_url('admin/galleries/order_ajax'); ?>', {}, function(data) {
$('#orderResult').html(data);
});
// save order
$('#save').click();
});
</script>
order_ajax.php
<?php if(count($images)>0): ?>
<div class="sortable-list">
<ol id="sortable">
<?php foreach($images as $image): ?>
<li <?php echo 'id="li_'.html_escape($image->img_id).'"'; ?>><?php echo img(array('src' => 'uploads/thumbs/'.html_escape($image->image)); ?></li>
<?php endforeach; ?>
</ol>
</div>
<?php endif; ?>
<script type="text/javascript">
$(function() {
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
});
</script>
I have also created and the order_ajax controller
public function order_ajax(){
// save order from pages
var_dump($_POST);
// if (isset($_POST['sortable'])) {
// $this->gallery->save_order($_POST['sortable']);
// }
// fetch all images (fetch all data)
$this->data['images'] = $this->gallery->get();
// load the view
$this->load->view('admin/gallery/order_ajax', $this->data, false);
}
So what I basically want to do is to drag the images around in order to change their order, and when I click the save button pass the (new) data/order to the controller and to store them in the database. How can I make this work?
Well, the solution was more simple than I thought.
On the index.php view I've put this
<script type="text/javascript">
$(function () {
$.post("<?php echo site_url('admin/galleries/order_ajax'); ?>", {}, function(data) {
$('#orderResult').html(data);
});
// save order
$('#save').click(function(){
var new_order = $("#sortable").sortable( "toArray" );
$.post("<?php echo site_url('admin/galleries/order_ajax'); ?>", { order_array: new_order }, function(data) {
$('#orderResult').html(data);
});
});
});
</script>
and this is the controller function
public function order_ajax(){
// save order from pages
if (isset($_POST['order_array'])) {
$this->gallery_model->save_order($_POST['order_array']);
}
// fetch all images
$this->data['images'] = $this->gallery->get();
// load the view
$this->load->view('admin/gallery/order_ajax', $this->data, false);
}
I have managed to load the new page into the div (thanks to everyone for your help) but it looks pretty bad (got menu bar and logo, but I only wanted the content), so instead I need to load only a div from the new page. I tried a new script but got redirected to the new page. Please help.
<script>
jQuery(document).ready(function() {
jQuery('.stil_link_img a').click(function(){
var x = $(this).attr("href") + "#content_eco";
jQuery("#new_page").load(x);
return false;
});
});
</script>
<div id="pachete">
<?php
$result=mysql_query("SELECT* FROM imagini");
while($data=mysql_fetch_row($result)){
if( ($data[3]==1)&&($data[2]==2) ){ ?>
<div class="stil_link_img">
<img src="upload/<?php echo $data[1];?>">
</div>
<?php }
}?>
</div>
<div id="new_page">
//some content which should be replaced with my loaded page
</div>
jQuery(document).ready(function() {
jQuery('.stil_link_img a').click(function(){
var $pageContent = jQuery('<div/>').load($(this).attr("href"));
jQuery("#new_page").html(jQuery("#content_eco",$pageContent).html());
return false;
});
});
I assume #content_eco is the divisions ID in the new page(the url from href attribute).
or you can load just the content from the url and avoid the link postback as
<script>
jQuery(document).ready(function() {
jQuery('.stil_link_img a').click(function(){
var x = $(this).attr("rel") + " #content_eco";
jQuery("#new_page").load(x);
return false;
});
});
</script>
<div id="pachete">
<?php
$result=mysql_query("SELECT* FROM imagini");
while($data=mysql_fetch_row($result)){
if( ($data[3]==1)&&($data[2]==2) ){ ?>
<div class="stil_link_img">
<img src="upload/<?php echo $data[1];?>">
</div>
<?php }
}?>
</div>
<div id="new_page">
//some content which should be replaced with my loaded page
</div>
Hope this helps you.
I kindly request that you help me identify the reason in the code why my app keeps refreshing endlessly. This does not allow me to navigate to other pages, Iam a learner in php and I suspect this could be the issue, help. Could it be a problem with the php arrangement?
Here is the code in index.php
<script type="text/javascript">
$(document).ready(function() {
$('#premium_b').click(function(e) {
e.preventDefault();
$('#tabs').tabs( "select" , 4 );
});
$('#tabs').bind('tabsselect', function(event, ui) {
if (ui.index == 4 )
$('#premium_b').css ('display', 'none');
else
$('#premium_b').css ('display', 'block');
});
});
</script>
<div id="bloc_134" class="li_bloc"><ul class="menu"><li>Home
</li>
<li>Config
</li>
<li>Customize
</li>
<li>Export
</li>
<li>Premium
</li>
<li>Statistics
</li>
<li>Doc
</li>
<li>About
</li>
<li>Other Apps
</li>
<li>FAQ
</li>
</ul>
Upgrade to Premium to get white branding and help us improve your favourite apps! : Click her
<div class="clear"></div>
</div>
</div>
<div id="alerts">
</div>
<div id="zone2" class="li_zone li_x1 li_y2">
<div id="contact_form_about"><div class="zone2">
</div></div>
<div id="contact_form_config"><div class="zone2"><script type="text/javascript">
function refreshApp (url) {
$.get(url, function(data) {
$('*').html(data);
});
}
$(document).ready(function() {
var options = {
success: showResponse,
beforeSubmit: disableButton
};
$('#tab_info_form_0').ajaxForm(options);
});
function addToPage() {
var obj = {
method: 'pagetab',
redirect_uri: 'https://apps.facebook.com/mtkenya-dev/?page_id=#contact_form_config',
};
FB.ui(obj);
}
</script>
<script>top.location.href='https://www.facebook.com/dialog/oauth?client_id=461688580525581&redirect_uri=https%3A%2F%2Fapps.facebook.com%2Fmtkenya-dev%2F%3Ftab%3Dcontact_form_config&scope=email,manage_pages'</script></div>
<div class="zone2"><script type="text/javascript">
$(document).ready(function() {
var options = {
success: showResponse,
beforeSubmit: disableButton
};
$('#contact_form').ajaxForm(options);
$('#customize_css').ajaxForm(options);
});
</script>
<div id="bloc_133" class="li_bloc"><p>Page non trouv?e</p>
</div>
</div>
</div>
<div id="contact_form_css"><div class="zone2"><script type="text/javascript">
function refreshApp (url) {
$.get(url, function(data) {
$('*').html(data);
});
}
$(document).ready(function() {
var options = {
success: showResponse,
beforeSubmit: disableButton
};
$('#tab_info_form_0').ajaxForm(options);
});
function addToPage() {
var obj = {
method: 'pagetab',
redirect_uri: 'https://apps.facebook.com/mtkenya-dev/?page_id=#contact_form_css',
};
FB.ui(obj);
}
</script>
<script>top.location.href='https://www.facebook.com/dialog/oauth?client_id=461688580525581&redirect_uri=https%3A%2F%2Fapps.facebook.com%2Fmtkenya-dev%2F%3Ftab%3Dcontact_form_css&scope=email,manage_pages'</script></div>
</div>
<div id="contact_form_doc"><div class="zone2"><script type="text/javascript">
$(function() {
$("#bloc_223").tabs({
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html( "Couldn't load this tab. We'll try to fix this as soon as possible. ");
}
},
cache: true
});
});
</script>
</div>
</div>
<div id="contact_form_export"><div class="zone2"><script type="text/javascript">
function refreshApp (url) {
$.get(url, function(data) {
$('*').html(data);
});
}
$(document).ready(function() {
var options = {
success: showResponse,
beforeSubmit: disableButton
};
$('#tab_info_form_0').ajaxForm(options);
});
function addToPage() {
var obj = {
method: 'pagetab',
redirect_uri: 'https://apps.facebook.com/mtkenya-dev/?page_id=#contact_form_export',
};
FB.ui(obj);
}
</script>
<script>top.location.href='https://www.facebook.com/dialog/oauth?client_id=461688580525581&redirect_uri=https%3A%2F%2Fapps.facebook.com%2Fmtkenya-dev%2F%3Ftab%3Dcontact_form_export&scope=email,manage_pages'</script></div>
<div id="footer" class="li_zone li_x1 li_y4"> </div>
</div>
</body>
</html>
Well, I see 3 times:
top.location.href=....
without any condition and not in a function call. That would certainly keep your page jumping.
I have the following code :
<?php
$i = 0;
foreach($this->list as $l) {
$link = JRoute::_("index.php?option=com_ecommerce&view=detail&id=$l->id");
<div class="quickview" id="quickview_<?php echo $i;?>">
<a href='<?php echo $link ?>' class='basic'>Quick view</a>
</div>
i++;
}
?>
<script>
jQuery(function ($){
var link = $('.quickview .basic').val();
$('.quickview .basic').click(function (e) {
alert(link);
return false;
});
});
</script>
I can't get link from tag <a>.
var link =$('.quickview .basic').attr("href"); should do the trick.
If you refer
I can't get link from tag <a>, please help me!
to the link you're clicking, this would work:
$(".quickview").find(".basic").click(function(e) {
e.preventDefault();
var url = $(this).attr("href");
alert(url);
});