views:

64

answers:

2

i need some help with this, i'm trying to generate some html with javascript, but always get the same, this is my javascript code

var datePickerHTML = function(id){
    var html = "<div id='"+id+"' class='ui-datepicker'>";
    html += "Hello World, my ID is "+id;
    html += "</div>";
    return html;
}

var UhmaCalendar = function(config){
    var dpID = 'dp'+config.inputField;
    this.dpID = dpID;
    jQuery('#'+config.inputField).after(function(){
      return datePickerHTML(dpID);
});
    jQuery('#'+config.btn).click(function(){
          jQuery('#'+dpID).toggle('slow');
    }
}

now, in my html i write

UhmaCalendar({
    btn : 'countday_pick',
    inputField : 'countday'
});
UhmaCalendar({
    btn : 'sartday_pick',
    inputField : 'startday'
});

this is for 2 diferent input and buttons, but they always show the same div with the same text, and id i check the html withthe firebug, only one div is created, ad i want 2 div with diferent ids i also try with

new UhmaCalendar({
    btn : 'sartday_pick',
    inputField : 'startday'
});

but is the same, what am i doing wrong here thanks

+4  A: 

You have forgotten to return html; in the function datePickerHTML.

With the newest edit, I was unable to reproduce the error. See http://jsbin.com/ucage4 for a demo which works correctly.

KennyTM
While true, it doesn't explain his symptom (in which he does actually get something). The quoted code is so messed up it's hard to tell what might be wrong...
T.J. Crowder
I'm going to fix my post, i forgot to putthat but here in my code is correct, but read my post again, this isn't the problem
Kstro21
@Kstro21: Then please fix all the syntax error. It is difficult to guess what's wrong from some vague symptom and wrong code.
KennyTM
Fixed the code, i just want to generate div with diferent id for diferent behaivor,
Kstro21
@Kstro: The fixed code works correctly. (Apart from a missing `)`.)
KennyTM
just want to generate div with diferents id, then i can give a diferent behaivor
Kstro21
@Kstro21: *"just want to generate div with diferents id, then i can give a diferent behaivor"* Which is exactly what KennyTM's example does, and demonstrates.
T.J. Crowder
ok, now i can see the to div in the html but the button is shown always the same div.......
Kstro21
dame, all that make the diference was this lines var dpID = 'dp'+config.inputField; this.dpID = dpID;
Kstro21
i don't know what have to do but it fix all, thanks to everyone
Kstro21
THANKSSSSSSSSSSSS
Kstro21
+1  A: 

Hard to tell what's wrong, the code as quoted is unparseable. Some notes that may be of use:

var datePickerHTML = function(id){
    var html = "<div id='"+id+"' class='ui-datepicker'>";
    html += "Hello World, my ID is "+id;
    html += "</div>";
    // Should probably have `return html;` here
}

var UhmaCalendar = function(config){
    this.dpID = 'dp'+config.inputField;
    jQuery('#'+config.inputField).after(function(){
      return datePickerHTML(dpID);
                         // ^-- This symbol is undefined, and != `this.dbID`
    });
    jQuery('#'+config.btn).click(function(){
          jQuery('#'dpID).toggle('slow');
                 // ^-- syntax error (and `dbID` is undefined here too)
    } // <-- Missing `);` here
}

If I had to guess at the intent:

var datePickerHTML = function(id){
    var html = "<div id='"+id+"' class='ui-datepicker'>";
    html += "Hello World, my ID is "+id;
    html += "</div>";
    return html; // tjc
}

var UhmaCalendar = function(config){
    var dpID = 'dp'+config.inputField; // tjc
    this.dpID = dpID; // tjc
    jQuery('#'+config.inputField).after(function(){
      return datePickerHTML(dpID);
    });
    jQuery('#'+config.btn).click(function(){
          jQuery('#'+dpID).toggle('slow'); // tjc
    }); // tjc
}

My suspicion is that the dpID thing(s) are the main error. I've fixed it above by creating a variable within the function which the enclosed functions inherit access to (because they're closures).

HTH

T.J. Crowder
i got the same result, the main problem is that, if a call the UhmaCalendar function once, it work perfect, but if i call it twice, i hope it create 2 diferent div, but only one is created, the further down in the code
Kstro21
did you try the code, is simple, please, try and give some north
Kstro21