Jump to content

jquery plugin help


s_ainley87

Recommended Posts

Hello there,

 

I am working on a project at the moment that requires some seriously skinned up select menus, I have managed to re-skin them but using this plugin however I have no way of determining what item has been selected from what select box as the plugin builds the same HTML every time it meets a select element in my HTML. I need some way of adding a unique identifier onto the end of a class, by manipulating the below plugin.

 

$.fn.customSelect = function() {
  // define defaults and override with options, if available
  // by extending the default settings, we don't modify the argument
        return this.each(function() {
                obj = $(this);  
                obj.after("<div class=\"selectoptions\"> </div>");
                obj.find('option').each(function(){ 
                        $(".selectoptions").append("<div id=\"" + $(this).attr("value") + "\" class=\"selectitems\"><span>" + $(this).html() + "</span></div>");
                });
                obj.before("<input type=\"hidden\" value =\"\" name=\"" + this.name + "\" class=\"customselect\"/><div class=\"iconselect\">" + this.title + "</div><div class=\"iconselectholder\"> </div>")
        .remove();
                $('.iconselectholder').hide();
                $(".iconselect").click(function(){
                        $(".iconselectholder").toggle("slow");});
                        $(".iconselectholder").append( $(".selectoptions")[0] );
                        $(".selectitems").mouseover(function(){
                        $(this).addClass("hoverclass");
                });
                $(".selectitems").mouseout(function(){
                        $(this).removeClass("hoverclass");
                });
                $(".selectitems").click(function(){
                        $(".selectedclass").removeClass("selectedclass");
                        $(this).addClass("selectedclass");
                        var thisselection = $(this).html();
                        $(".customselect").val(this.id);
                        $(".iconselect").html(thisselection);
                        $(".iconselectholder").toggle("slow")
                });
        });  
  // do the rest of the plugin, using url and settings
}

 

 

Link to comment
https://forums.phpfreaks.com/topic/211154-jquery-plugin-help/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.