geocomplete is not a function using autocomplete - php

Hi i am using autopopulated code getting the error geocomplete is not a function if is used it in locally (seperated file) it works for me what can be the error
$(function () {
$("#location").geocomplete({
//alert("gine");
details: ".geo-details",
detailsAttribute: "data-geo"
});
});
Pls suggust

You must to add the jquery.min.js and jquery.geocomplete.min.js before call the geocomplete() method:
<script src="/javascripts/jquery.min.js" type="text/javascript"></script>
<script src="/javascripts/jquery.geocomplete.min.js" type="text/javascript"></script>
<script type="text/javascript">
$("#location").geocomplete({
details: ".geo-details",
detailsAttribute: "data-geo"
});
</script>

Related

How to add JQUERY function to phpfox?

I'm a newbie to php fox. i want to add jquery function to phpfox but no success. please suggest me proper way of adding jquery function to phpfox.
<script type="text/javascript" >
$Behaviour.onLoadEvents = function(){
}
$Behavior.onClickEvents = function() {
};
$(document).ready(function() {
$("div").click(function() {
alert("Hello, world!");
});
});
no success with all of these three functions.
and getting an error
SyntaxError: missing { before function body
on console window

how to call a codeigniter function from jquery ajax

I'm using the jquery-datatables-editable plugin at https://code.google.com/p/jquery-datatables-editable/wiki/EditCell#Client-side_configuration with CI.I have:
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$('#myDataTable').dataTable().makeEditable({
sUpdateURL: "/js/jquery-databatables-editable/AjaxUpdate_1.php/index"
});
});
</script>
on the client side page. I want to be able to post to a class a CI library class/function on the server side, but the above does not seem to work. Is there a way to do this?
That's depends on the configuration you have.
Mostly common, if you are using the default setup:
In you Javascript file or view (if inline)
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$('#myDataTable').dataTable().makeEditable({
sUpdateURL: "/index.php/your_controller/function_name"
});
});
</script>
In your routes.php
$route["function_name"] = "your_controller/function_name/";
Lastly, you need to create a function in your controller and output the expected format:
function function_name(){
echo json_encode('whatever you need to return');
}
Hope it helps!

Refresh a div with php data every 10 seconds using jQuery

Am trying to refresh data stored in a div every 10 seconds using jQuery.
My HTML code is:
<!DOCTYPE html>
<head>
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
setInterval(function() {
$("#latestData").load("getLatestData.php #latestData");
}, 10000);
});
</script>
</head>
<body>
<div id = "latestData">
</div>
</body>
</html>
And the PHP code I am using (temporarily as I know this won't change due to the same "data"):
<?php
echo "test";
?>
However, it isn't even showing "test" on the html page.. could anyone suggest where I have gone wrong?
Many thanks
jQuery load method works in a different way. Try reading its documentation.
You don't have to specify destination element ID twice, remove the second one, like this:
$("#latestData").load("getLatestData.php");
Here's a way that will solve what you want to achieve, using the $.get method in jQuery:
$(document).ready(function () {
setInterval(function() {
$.get("getLatestData.php", function (result) {
$('#latestData').html(result);
});
}, 10000);
});
If you want to refresh message count just use this code:
$(document).ready(function () {
setInterval(function () {
$("#ID").load();
}, 1000);
});

jQuery script function seems not to be loaded

I am about to use jQuery in my wordpress installation. Thus I have used the appropriate wp_enqueue_script function to load this and additionally the jQZoom-script.
As a result, the following lines can be found in my header in this order
<link rel='stylesheet' id='jQZoom_style-css' href='http://mysite.de/wordpress/wp-content/themes/twentytwelve-child/jqzoom_ev-2.3/css/jquery.jqzoom.css?ver=2.3' type='text/css' media='all' />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js?ver=1.9.1'></script>
<script type='text/javascript' src='http://mysite.de/wordpress/wp-content/themes/twentytwelve-child/jqzoom_ev-2.3/js/jquery.jqzoom-core.js?ver=2.3'></script>
The according files do all exist.
However, my little test script shortly above the footer (i.e. in the body) does not work (neither does the demanded function):
<script type='text/javascript'>
if (jQuery()) {
alert('3ja');
} else {
alert('3nein');
}
if ($()) {
alert('2ja');
} else {
alert('2nein');
}
if (jqzoom()) {
alert('1ja');
} else {
alert('1nein');
}
</script>
I get the 3ja and the 2ja, but neither a 1ja nor a 1nein
Also I have the following in my body, which is supposed to show the zoom function:
<script type='text/javascript'>
$(document).ready(function(){
$('.zoomTarget').jqzoom();
});
</script>
<a href="http://mysite.de/wordpress/wp-content/uploads/triumph_big3.jpg" title="triumph_big3" class="zoomTarget">
<img src="http://mysite.de/wordpress/wp-content/uploads/triumph_small3.jpg" title="triumph_small3" />
</a>
The Chrome js console shows the following errors:
Uncaught ReferenceError: jqzoom is not defined mysite.de:131
(anonymous function) mysite.de:131
Uncaught TypeError: Object [object Object] has no method 'jqzoom' mysite.de:111
(anonymous function) helga-matzke.de:111
c jquery.min.js:3
p.fireWith jquery.min.js:3
b.extend.ready jquery.min.js:3
H jquery.min.js:3
Thank you!
Try adding the migrate js too for 1.9.1
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script>

Yii-bootstrap Tabs event handler

I'm using bootstap tabs, and Im trying to load the content via ajax rather than set it in PHP. My code:
<script type="text/javascript">
function test(e){
console.log(e.target);
//load ajax stuff here
}
</script>
<?php
$this->widget('bootstrap.widgets.TbTabs', array(
'type'=>'tabs',
'placement'=>'above', // 'above', 'right', 'below' or 'left'
'tabs'=>array(
array('label'=>'Ogólne', 'content'=>'Czekaj...', 'active'=>true),
array('label'=>'Książka adresów', 'content'=>'Czekaj...'),
array('label'=>'Cośtam', 'content'=>'Czekaj...'),
),
'events'=>array('shown'=>'test')
)); ?>
However I keep getting this error:
Uncaught TypeError: Object test has no method 'apply'. I tried creating an object, but it still didn't work. Any ideas?
A little clarification, JS code created by the framework:
<script type="text/javascript">
/*<![CDATA[*/
jQuery(function($) {
jQuery('a[rel="tooltip"]').tooltip();
jQuery('a[rel="popover"]').popover();
jQuery('#yw0').tab('show');
jQuery('#yw0').on('shown', 'test');
jQuery('#collapse_0').collapse({'parent':false,'toggle':false});
});
/*]]>*/
</script>
This should work
Javascript:
<script type="text/javascript">
var test = function(e) {
console.log(e.target);
//load ajax stuff here
}
</script>
TbTabs events ( prefixed with 'js:' )
<?php
...
'events'=>array('shown'=>'js:test'),
....
?>

Categories