0

first off i fell really stupid submitting this question as there is so many thats discussed it over countless forums but... i've been thru them all and i still can't get it to work.... or i can't get it to work with the proper wordpress method....

im writing a plugin with a submit form where i'm adding a datepicker to a submit form

    function datepickertester() {
wp_enqueue_script('jquery-ui-datepicker');

wp_enqueue_style( 'datepicker', plugins_url( '/js/css/datepicker.css', __FILE__ ) );

?>


<script type="text/javascript">

jQuery(document).ready(function() {
    jQuery('.inputtable_date').datepicker({

    });



/* Danish initialisation for the jQuery UI date picker plugin. */
/* Written by Jan Christensen ( [email protected]). */
(function( factory ) {
    if ( typeof define === "function" && define.amd ) {

        // AMD. Register as an anonymous module.
        define([ "../datepicker" ], factory );
    } else {

        // Browser globals
        factory( jQuery.datepicker );
    }
}(function( datepicker ) {

datepicker.regional['da'] = {
    closeText: 'Luk',
    prevText: '&#x3C;Forrige<---',
    nextText: '--->Næste&#x3E;',
    currentText: 'Idag',
    monthNames: ['Januar','Februar','Marts','April','Maj','Juni',
    'Juli','August','September','Oktober','November','December'],
    monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun',
    'Jul','Aug','Sep','Okt','Nov','Dec'],
    dayNames: ['Søndag','Mandag','Tirsdag','Onsdag','Torsdag','Fredag','Lørdag'],
    dayNamesShort: ['Søn','Man','Tir','Ons','Tor','Fre','Lør'],
    dayNamesMin: ['Sø','Ma','Ti','On','To','Fr','Lø'],
    weekHeader: 'Uge',
    showWeek: 'Uge',
    dateFormat: 'dd-mm-yy',
    firstDay: 1,
    isRTL: false,
    showMonthAfterYear: false,
    yearSuffix: ''};
datepicker.setDefaults(datepicker.regional['da']);

return datepicker.regional['da'];

}));
});
</script>

<?php
}

the code above work as its supposed to. so... it works, well i know it's not the proper wordpress method for handling scripts so i've moved the script into a file called jscript-test.js in the plugin folder

so heres the problem i've tried to registre the script 50 times from forum discussions and tutorials i've found around the web but none of them worked for me

obviously i'm not gonna list all 50 ways i've tried to make it work. here 1 of the ways i've tried registre it.

add_action( 'wp_register_script', 'script_registration' );
function script_registration() {
    wp_register_script('jscript-test', plugins_url( '/js/jscript-test.js', __FILE__ ) );
}


function my_scripts_method() {
wp_enqueue_script('jquery-ui-datepicker');
wp_enqueue_style( 'datepicker', plugins_url( '/js/css/datepicker.css', __FILE__ ) );
wp_enqueue_style( 'jscript-test');

}

what is it i'm doing wrong?

.........edit.......

i fell like i should add some more info about my plugin. i'm calling the function below with shortcode on my wordpress page

when i use the first function i atop the page, in my function inputtable_func() it works like a charm and when when i use the second code atop the page where i'm trying to registre the .js script its not working... i've given an example in the bottom code below on how i'm calling both functions

function inputtable_func() {
echo '

<form action="' . $_SERVER['REQUEST_URI'] . '" method="post">

<table><tr>
<td class="inputtable_label_day"><label for="day">Dag</label></td>
<td class="inputtable_text_dato"><label for="dato">Dato</label></td>
<td class="inputtable_text_start"><label for="start">Start</label></td>
<td class="inputtable_text_slut"><label for="slut">Slut</label></td>
<td class="inputtable_text_pause"><label for="Pause">Pause</label></td>
<td class="inputtable_text_egenb"><label for="egenb">Egen Betaling</label></td>
<td class="inputtable_text_tot"><label for="tot">Total kørt ind</label></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Mandag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateA" value="' . (isset($_POST['dateA']) ? $dateA : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startA" value="' . (isset($_POST['startA']) ? $startA : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutA" value="' . (isset($_POST['slutA']) ? $slutA : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseA" value="' . (isset($_POST['pauseA']) ? $pauseA : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbA" value="' . (isset($_POST['egenbA']) ? $egenbA : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totA" value="' . (isset($_POST['totA']) ? $totA : null) . '"></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Tirsdag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateB" value="' . (isset($_POST['dateB']) ? $dateB : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startB" value="' . (isset($_POST['startA']) ? $startA : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutB" value="' . (isset($_POST['slutB']) ? $slutB : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseB" value="' . (isset($_POST['pauseB']) ? $pauseB : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbB" value="' . (isset($_POST['egenbB']) ? $egenbB : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totB" value="' . (isset($_POST['totB']) ? $totB : null) . '"></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Onsdag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateC" value="' . (isset($_POST['dateC']) ? $dateC : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startC" value="' . (isset($_POST['startC']) ? $startC : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutC" value="' . (isset($_POST['slutC']) ? $slutC : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseC" value="' . (isset($_POST['pauseC']) ? $pauseC : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbC" value="' . (isset($_POST['egenbC']) ? $egenbC : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totC" value="' . (isset($_POST['totC']) ? $totC : null) . '"></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Torsdag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateD" value="' . (isset($_POST['dateD']) ? $dateD : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startD" value="' . (isset($_POST['startD']) ? $startD : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutD" value="' . (isset($_POST['slutD']) ? $slutD : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseD" value="' . (isset($_POST['pauseD']) ? $pauseD : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbD" value="' . (isset($_POST['egenbD']) ? $egenbD : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totD" value="' . (isset($_POST['totD']) ? $totD : null) . '"></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Fredag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateE" value="' . (isset($_POST['dateE']) ? $dateE : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startE" value="' . (isset($_POST['startE']) ? $startE : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutE" value="' . (isset($_POST['slutE']) ? $slutE : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseE" value="' . (isset($_POST['pauseE']) ? $pauseE : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbE" value="' . (isset($_POST['egenbE']) ? $egenbE : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totE" value="' . (isset($_POST['totE']) ? $totE : null) . '"></td>
</tr><tr>
<td class="inputtable_label_day"><label for="day">Lørdag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateF" value="' . (isset($_POST['dateF']) ? $dateF : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startF" value="' . (isset($_POST['startF']) ? $startF : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutF" value="' . (isset($_POST['slutF']) ? $slutF : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseF" value="' . (isset($_POST['pauseF']) ? $pauseF : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbF" value="' . (isset($_POST['egenbF']) ? $egenbF : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totF" value="' . (isset($_POST['totF']) ? $totF : null) . '"></td>
<br></tr><tr>
<td class="inputtable_label_day"><label for="day">Søndag</label></td>
<td class="inputtable_input_dateA"><input class="inputtable_date" type="text" name="dateG" value="' . (isset($_POST['dateG']) ? $dateG : null) . '"></td>
<td class="inputtable_input_startA"><input class="inputtable_start" type="text" name="startG" value="' . (isset($_POST['startG']) ? $startG : null) . '"></td>
<td class="inputtable_input_slutA"><input class="inputtable_slut" type="text" name="slutG" value="' . (isset($_POST['slutG']) ? $slutG : null) . '"></td>
<td class="inputtable_input_pauseA"><input class="inputtable_pause" type="text" name="pauseG" value="' . (isset($_POST['pauseG']) ? $pauseG : null) . '"></td>
<td class="inputtable_input_egenbA"><input class="inputtable_egenb" type="text" name="egenbG" value="' . (isset($_POST['egenbG']) ? $egenbG : null) . '"></td>
<td class="inputtable_input_totA"><input class="inputtable_tot"  type="text" name="totG" value="' . (isset($_POST['totG']) ? $totG : null) . '"></td></tr>
 <tr><td class="inputtable_submit"><input  type="submit" name="submit" value="send"></td></tr></table>
</form>';

//datepickertester ...This work.....
datepickertester();

// my_scripts_method .....this dossent work......
my_scripts_method();

}

=============================================================

A bit thanks to kaloyan you've been a great help :)

i've posted the end result below that got it working like it should in case anyone else should need this as a reference :)

function scripts_registration() {
    include 'js/jscript-test.js';
    wp_enqueue_script( 'jquery-ui-datepicker' );
    wp_enqueue_style( 'datepicker', plugins_url( '/js/css/datepicker.css', __FILE__ ) );
    wp_enqueue_script( 'jscript-test', plugins_url( '/js/jscript-test.js', __FILE__ ) );
}
add_action( 'wp_enqueue_scripts', 'scripts_registration' );
2
  • Is it adding any script tag into the page? If so whats the path of it? Are you including the wp_footer in your theme? codex.wordpress.org/Function_Reference/wp_footer this is where your scripts are loaded in Commented Feb 6, 2015 at 17:02
  • no its not. and yes i've included wp_footer in my theme :) Commented Feb 6, 2015 at 17:56

1 Answer 1

1

First off you are using the wp_register_script hook. The bad thing about this hook is .. it doesn't exist. :) You should use wp_enqueue_scripts.

Second thing, you are trying to enqueue your script using wp_enqueue_style. You should use wp_enqueue_script.

You can consolidate all the code above into the following:

function scripts_registration() {
    wp_enqueue_script( 'jquery-ui-datepicker' );
    wp_enqueue_style( 'datepicker', plugins_url( '/js/css/datepicker.css', __FILE__ ) );
    wp_enqueue_script( 'jscript-test', plugins_url( '/js/jscript-test.js', __FILE__ ) );
}
add_action( 'wp_enqueue_scripts', 'scripts_registration' );

Reference:

http://codex.wordpress.org/Function_Reference/wp_register_script http://codex.wordpress.org/Function_Reference/wp_enqueue_script http://codex.wordpress.org/Plugin_API/Action_Reference/wp_enqueue_scripts

Sign up to request clarification or add additional context in comments.

2 Comments

I've edited my answer so now the include happens in a single function. If it still doesn't work, check if you get any errors in the console and if the script file is getting included in the page.
thanks for your help kaloyan! i that did the trick now its working like a charm :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.