wordpress - Jquery UI Dialog -


i try use jquery ui first time. here show code:

(in wordpress index file )

public function enqueue_admin_scripts()      {         wp_enqueue_script( $this->plugin_slug .'-admin-styles', plugins_url( 'js/jquery-1.9.1.js', __file__ ) );         wp_enqueue_script( $this->plugin_slug .'-admin-styles', plugins_url( 'js/admin.js', __file__ ) );         wp_enqueue_script( $this->plugin_slug .'-admin-styles', plugins_url( 'js/jquery-ui-1.10.3.custom.min.js', __file__ ) );      } 

here admin.js

jquery(document).ready(function(){      jquery("#add_new_gallery").click(function(){          // alert (456);      jquery(function() {       var name = jquery( "#name" ),       email = jquery( "#email" ),       password = jquery( "#password" ),       allfields = jquery( [] ).add( name ).add( email ).add( password ),       tips = jquery( ".validatetips" );      function updatetips( t ) {       tips         .text( t )         .addclass( "ui-state-highlight" );       settimeout(function() {         tips.removeclass( "ui-state-highlight", 1500 );       }, 500 );     }      function checklength( o, n, min, max ) {       if ( o.val().length > max || o.val().length < min ) {         o.addclass( "ui-state-error" );         updatetips( "length of " + n + " must between " +           min + " , " + max + "." );         return false;       } else {         return true;       }     }      function checkregexp( o, regexp, n ) {       if ( !( regexp.test( o.val() ) ) ) {         o.addclass( "ui-state-error" );         updatetips( n );         return false;       } else {         return true;       }     }      jquery( "#dialog-form" ).dialog({       autoopen: false,       height: 300,       width: 350,       modal: true,       buttons: {         "create account": function() {           var bvalid = true;           allfields.removeclass( "ui-state-error" );            bvalid = bvalid && checklength( name, "username", 3, 16 );           bvalid = bvalid && checklength( email, "email", 6, 80 );           bvalid = bvalid && checklength( password, "password", 5, 16 );            bvalid = bvalid && checkregexp( name, /^[a-z]([0-9a-z_])+jquery/i, "username may consist of a-z, 0-9, underscores, begin letter." );           // jquery.validate.js (by joern), contributed scott gonzalez: http://projects.scottsplayground.com/email_address_validation/           bvalid = bvalid && checkregexp( email, /^((([a-z]|\d|[!#\jquery%&'\*\+\-\/=\?\^_`{\|}~]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])+(\.([a-z]|\d|[!#\jquery%&'\*\+\-\/=\?\^_`{\|}~]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])*([a-z]|\d|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])))\.)+(([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])|(([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])([a-z]|\d|-|\.|_|~|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])*([a-z]|[\u00a0-\ud7ff\uf900-\ufdcf\ufdf0-\uffef])))\.?jquery/i, "eg. ui@jquery.com" );           bvalid = bvalid && checkregexp( password, /^([0-9a-za-z])+jquery/, "password field allow : a-z 0-9" );            if ( bvalid ) {             jquery( "#users tbody" ).append( "<tr>" +               "<td>" + name.val() + "</td>" +               "<td>" + email.val() + "</td>" +               "<td>" + password.val() + "</td>" +             "</tr>" );             jquery( ).dialog( "close" );           }         },         cancel: function() {           jquery( ).dialog( "close" );         }       },       close: function() {         allfields.val( "" ).removeclass( "ui-state-error" );       }     });      jquery( "#create-user" )       .button()       .click(function() {         jquery( "#dialog-form" ).dialog( "open" );       });   });     });  }) 

but getting such error:

uncaught typeerror: object [object object] has no method 'dialog' .

what can problem? how solve this?

thanks.

besides reordering of includes , obvious answer jquery included in wordpress admin see 2 more issues.

  • 1 - "$this->plugin_slug .'-admin-styles'" on 3 files tell wordpress include 1 file, need define unique handle names not overwite previous ones.
  • 2 - might want consider define dependencies like: wp_enqueue_script( $this->plugin_slug .'-admin-styles', plugins_url( 'js/jquery-1.9.1.js', __file__ ), array('jquery') ); jquery whatever unique handle give jquery file.

in conclusion should have:

public function enqueue_admin_scripts()  {     wp_enqueue_script( $this->plugin_slug .'-admin-styles-new-jquery', plugins_url( 'js/jquery-1.9.1.js', __file__ ) );     wp_enqueue_script( $this->plugin_slug .'-admin-styles-new-jquery-ui', plugins_url( 'js/jquery-ui-1.10.3.custom.min.js', __file__ ), array( $this->plugin_slug .'-admin-styles-new-jquery' ) );     wp_enqueue_script( $this->plugin_slug .'-admin-styles-my-admin-javascript', plugins_url( 'js/admin.js', __file__ ), array( $this->plugin_slug .'-admin-styles-new-jquery' ) ); } 

Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

css - Firefox for ubuntu renders wrong colors -