I have made a declaration like this in php (taken from WordPress path url in js script file):
<script type="text/javascript">
var templateurl = "<?php bloginfo('template_url') ?>";
</script>
then i have this code in my javascript (myjava.js):
init : function(ed, url) {
ed.addCommand('mcearrow_shortcodes', function() {
ed.windowManager.open({
file : url + '/interface.php',
width : 410 + ed.getLang('arrow_shortcodes.delta_width', 0),
height : 250 + ed.getLang('arrow_shortcodes.delta_height', 0),
inline : 1
}, {
plugin_url : url
});
});
ed.addButton('arrow_shortcodes', {
title : 'arrow_shortcodes.desc',
cmd : 'mcearrow_shortcodes',
image : url + '/btn.png'
});
ed.onNodeChange.add(function(ed, cm, n) {
cm.setActive('arrow_shortcodes', n.nodeName == 'IMG');
});
},
I want to change all the 'url +' with templateurl, I've tried to use this:
file : templateurl + '/includes/scripts/interface.php'
But it doesn't work. It doesn't load the interface.php. However, if I use 'url +', the interface.php is loaded perfectly.
Problem is, I want to put my interface.php in different folder. Not in the same folder where myjava.js is located.
What's the correct way to use my templateurl variable?
Many thanks!
Do the templateurl has the value? Please check it. You are assigning php variable so please echo it.
<script type="text/javascript">
var templateurl = "<?php echo bloginfo('template_url') ?>";
</script>
Related
I have an auto suggest code with jquery and php, the issue is the jquery is sending ajax request for which the browser is responding with 400(bad request)
The problem is the query should have been generated like
http://localhost/abc/index.php?/controller/autoComplete**?q=a**&limit=5×tamp=1382
but the request is generated like
http://localhost/abc/index.php?/controller/autoComplete **&q=a**&limit=5×tamp=1382
The autocomplete function is like
$.fn.extend({
autocomplete: function(urlOrData, options) {
var isUrl = typeof urlOrData == "string";
options = $.extend({}, $.Autocompleter.defaults, {
url: isUrl ? urlOrData : null,
data: isUrl ? null : urlOrData,
delay: isUrl ? $.Autocompleter.defaults.delay : 10,
max: options && !options.scroll ? 5 : 5
}, options);
The code that invokes the function in view which has text field with id = 'search'
$(document).ready(function(){
$("#search").autocomplete("<?php echo "http://localhost/abc/index.php?/controller/autoComplete"; ?>", {
selectFirst: true
});
});
Where autocomplete is the function in controller
I made a change in the config.php of my code igniter i changed
$config['index_page'] = 'index.php?';
I guess the url is formatted like this because you already have a ? sign in your url. Other parameters will be seperated with an & sign
did you try a backslash ** with **?
$(document).ready(function(){
$("#search").autocomplete("<?php echo "http://localhost/abc/index.php\?/controller/autoComplete"; ?>", {
selectFirst: true
});
});
I have a little problem with calling a file in a WordPress plugin using ajax.I have this script:
<script type="text/javascript">
function setVal()
{
var val = jQuery('#custom_text_message').val()
alert('Setting the value to "' + val + '"')
jQuery.post('session.php', {value: val})
alert('Finished setting the value')
}
jQuery(document).ready(function() {
jQuery('#custom_text_message').blur(function() {setVal()});
//setTimeout('setVal()', 3000);
});
</script>
But when this function gets called, it shows an error in the console file not found. I want to know if this is the correct way to use ajax in WordPress. If not, how can I call a file which is in the root folder of site name session.php? I'm pretty new to WordPress.
I have solve my problem on my own.First i have define ajaxurl in my themes function.php like below:
<?php
add_action('wp_head','pluginname_ajaxurl');
function pluginname_ajaxurl() {
?>
<script type="text/javascript">
var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
</script>
<? }
?>
And I put the below script on the top of my plugin file.
<script type="text/javascript">
function setVal()
{
var val = jQuery('#custom_text_message').val()
var data = {
action: 'my_action',
value: val,
};
jQuery.post(ajaxurl, data, function(response) {
alert('Got this from the server: ' + response);
});
}
jQuery(document).ready(function() {
jQuery('#custom_text_message').blur(function() {setVal()});
//setTimeout('setVal()', 3000);
});
</script>
and here's the field, for which i am trying to do in my plugin.
<textarea name="custom_text_message" id="custom_text_message"></textarea>
and then I put my action which i m calling to my script in function.php.
add_action('wp_ajax_my_action', 'my_action_session');
function my_action_session() {
global $wpdb; // this is how you get access to the database
session_start();
$_SESSION['cus_msg'] = $_POST['value'];
die(); // this is required to return a proper result
}
and then call my session value in to my function.That's all i do and work for me and i hope this will helps someone else.
Note:
The wp_ajax_your_action action is for admin if you need to use it on the front end the action would be wp_ajax_nopriv_your_action.
In WordPress, Ajax requests should be made to http://your-wordpress-site/wp-admin/admin-ajax.php - which can be obtained using admin_url( 'admin-ajax.php' ) - and you should use action parameter to specify which function to call. You can pass the admin-ajax path to your javascript file via localization.
Add to your plugin PHP file after you enqueue your script:
wp_localize_script( 'your-script', 'js_obj', array('ajax_url' => admin_url( 'admin-ajax.php' ) );
In your javascript:
jQuery.post(js_obj.ajax_url, {value: val, action: 'run-my-ajax'})
Function to process the ajax in your plugin PHP file:
function call_my_ajax(){
// do stuff
exit;
}
add_action('wp_ajax_run-my-ajax', 'call_my_ajax');
add_action('wp_ajax_nopriv_run-my-ajax', 'call_my_ajax');
Read more: https://codex.wordpress.org/AJAX_in_Plugins
<script type="text/javascript">
function setVal()
{
jQuery.ajax({url:"<?php bloginfo('url');?>/wp-content/plugins/plugin_folder_name/session.php",success:function(result){alert(result);}}
}
</script>
WordPress works on absolute paths, use a complete URL instead of the relative URL:
jQuery.post('session.php', {value: val})
Use something like:
jQuery.post('<?php bloginfo('url');?>/wp-content/plugins/plugin_folder_name/session.php', {value: val})
I have installed TinyMCE into my codeigniter build, and I have included the image manager.
In the image manager plugin (which is saved in the public/assets folder) there is a php config file which defines the image & file path constants.
define('DIR_IMAGES', 'images/path/here'); etc
The problem I have is I need the path to be dynamic depending on some data in the database, such as template_name, but I dont know how to include the right files into the config file so I can view the dynamic info.
So if the user has a template_name saved then I need the path to be
define('DIR_IMAGES', $template_name.'images/path/here');
I have also defined the template_name in a constant in core/MY_Controller.php so if I could access that variable that would be easier than doing a query to the DB but either way will work.
Can someone give me a hand with this, thanks a lot!
I've just custom tinymce image but not using TinyMCE image manager.
but I use the tutorial from the link below.
How-to implement a custom file browser
<!-- Start tinymce custom -->
<script type="text/javascript">
tinyMCE.init({
<!--
your tiny mce init here
--->
<!-- custom file browser callback -->
file_browser_callback : 'myFileBrowser',
});
function myFileBrowser (field_name, url, type, win) {
// this is your dynamic image path
var cmsURL = "<?php echo base_url() ?>admin/media/select_image"; <== you can set as you wish
if (cmsURL.indexOf("?") < 0) {
//add the type as the only query parameter
cmsURL = cmsURL + "?type=" + type;
}
else {
//add the type as an additional query parameter
// (PHP session ID is now included if there is one at all)
cmsURL = cmsURL + "&type=" + type;
}
tinyMCE.activeEditor.windowManager.open({
file : cmsURL
,width : 600
,height : 600
,resizable : "yes"
,inline : "yes"
,close_previous : "yes"
,popup_css : true // Disable TinyMCE's default popup CSS
}, {
window : win,
input : field_name
});
return false;
}
</script>
Add a "data-" attribute to your tinymce element and echo your desired url from there. Then in tinymce activeEditor, access that data- attribute value.
Textarea
<textarea name="description" class="tinymceDescription" data-uploadLink="<?php echo DIR_IMAGES; ?>" ></textarea>
TinyMce
tinymce.init({
// other settings here
//either use this if you are uploading automatically.
images_upload_url: $(tinymce.activeEditor.targetElm).attr("data-uploadLink"),
//or use this if you want to override tinymce auto upload.
images_upload_handler: function (blobInfo, success, failure) {
var xhr, formData;
var uploadLink = $(tinymce.activeEditor.targetElm).attr("data-uploadLink");
xhr = new XMLHttpRequest();
xhr.withCredentials = false;
xhr.open('POST', uploadLink);
xhr.onload = function () {
var json;
if (xhr.status != 200) {
failure('HTTP Error: ' + xhr.status);
return;
}
json = JSON.parse(xhr.responseText);
if (!json || typeof json.location != 'string') {
failure(xhr.responseText);
return;
}
success(json.location);
};
formData = new FormData();
formData.append('file', blobInfo.blob(), blobInfo.filename());
xhr.send(formData);
}
});
The point here is to show you how i got a dynamic upload url into tinymce from the currently selected tinymce instance. The way you upload is your choice which i hope you know how to handle. But ether way, i have provide both the automatic and custom examples.
hi i am using codeigniter and jquery .
i am using this code to focus the page to a defined location (here , a div).
jQuery(function() {
var profile_url = "<?php echo $widgets['basic_info_widget']['prof_url']; ?>";
if(((window.location+"/") != (baseurl+profile_url)) && (window.location != (baseurl+profile_url))) {
location.hash = '#menu';
}
});
by this i am focusing the page to <div id='menu'></div>
location.hash = '#menu'
but the thing is when the script runs #menu is added after the url
http://example.com#menu
*can i fous this div without adding #menu at the end of the url .
like
http://example.com
please help . thanks in advance .
Check this demo
$(document).ready(function (){
$("html, body").animate({scrollTop: $("#second_div").offset().top }, 2000);
});
Using scrollTop
I am using tinyMCE for Wordpress.
Which is the way to load text from server via AJAX?
Until now I have:
php:
<?php echo the_editor($_POST ? $_POST['content'] : '', $id = 'content'); ?>
javascript (which is failing...):
$("select[name='tpl']").live("change", function(e) {
var file = $(this).val();
var loadUrl = varsJs.WORDPRESS_PLUGIN_URL + "/templates/" + file;
$.get(loadUrl, function(result) {
$("#content").val(result);
});
});
The variable result is loaded with the desired text. No problem with that. But how pass this content to the tinyMCE?
if (typeof tinymce === "object"){
$("select[name='tpl']").live("change", function(e) {
var file = $(this).val();
var loadUrl = varsJs.WORDPRESS_PLUGIN_URL + "/templates/" + file;
$.get(loadUrl, function(result) {
tinymce.get("content").focus();
tinymce.activeEditor.setContent(result);
});
});
}
Note: varsJs is the second parameter of wp_localize_script function used to pass data from php to javascript. Really no needed in this precise issue but useful to know it.
Try this code, where 'content' is your field #ID
tinymce.init(tinyMCEPreInit.mceInit['content']);
this way and once tinymce is also loaded in current html,
you will reinit only one field, the one you received from Ajax Request.
also set this code before ajax saving Call
tinymce.activeEditor.save(); // get editor instance