Develop Reference

Duplicate Object after .click() JQuery

I need a help,
i have .click() event for adding some value into my table.
$("#ButtonSave").click(function()
{
var someObject: myCurrentObject = new myCurrentObject();
someObject.A = String($("someInputTextId").val());
someObject.B = String($("someInputTextId").val());
}
});
for first click, after i put console.log(someObject); show correct result. and in second click, someOject value already flushed, but become duplicate.
any solution?

Typescript: Access variable outside of a loop

I've created an array and want to access the created elements outside of the loop. I know that they are not in the scope and writing this. infront of it wont make them accessible either.
colIdx = colIdx + this.columns.findIndex(c => c.editable);
this.focusInput(rowIdx, colIdx);
this.autocompletes.toArray().forEach(el => {
console.log(el);
})
I have a table with lots of input fields with an autocomplete function and a suggestion panel. I also have a custom method which lets the user tab with the enter key. However at first, tabbing with enter didnt close the suggestion panel of the autocomplete hence after a while all the suggestion panels where open.
Thats why I've created the method above. You could actually ignore the first two lines because they are needed for the tabbing with enter.
this.autocompletes is a Querylist with all my input elements. I've turned them into an array and called each element el.
This way I'm able to call a closePanel() method on el in order to close the suggestion panels of the autocomplete method. However doing it this way shuts down the suggestion panels of ALL el elements. Thats why I need the index of el the user has set focus on and close this one.
In order to do so I have to access el outside the for-loop it has been created in.

You can initialize an empty array outside the loop like var arr: type = emptyArr[]; and then push the data (el) in it from inside the loop.
To push do something like: arr.push(el) from inside the loop and then access it outside the loop.

The easiest way would be to just assign it them to an array outside the scope of the loop:
elements: any[] = [];
colIdx = colIdx + this.columns.findIndex(c => c.editable);
this.focusInput(rowIdx, colIdx);
this.autocompletes.toArray().forEach(el => {
console.log(el);
this.elements.push(el);
});
// You can now loop over `this.elements` and do what you need with them.

this.autocompletes is a Querylist with all my input elements
This means autocompletes won't change and you can save it in your Init call into a local variable.
ex: if your form have 4 input it will still contain 4 unless you are removing it from the dom. Save it in a local variable during your create/init. depending how you have written your code.
Here is what you can do.
//do not do .toArray again and again its just not usefull as your data is constant
elements: Array<any> = this.autocompletes.toArray();
...
elements.forEach(el => {
//work on elements here
//to check focus on el you could do something like this el.is(":focus")
});

How to create a string and use a function that's named after it?

Sorry for bad wording in the question but it's hard to explain for me. I'm using several bxsliders on a page and some are placed in hidden divs. Unfortunately images are not shown in the slider after making the parent div visible unless the slider is reloaded (See here: bxSlider within show/hide divs). So let's say I initiate the sliders at the beginning with:
var slider_0=$("#slider_0 .bxslider").bxSlider({
//bxslider options here
});
var slider_4=$("#slider_4 .bxslider").bxSlider({
//bxslider options here
});
var slider_7=$("#slider_7 .bxslider").bxSlider({
//bxslider options here
});
The sliders are not consecutively numbered but there is a navigation and if I click the 7th element it leads to slider_7. So I could get the index of the clicked item with:
$(this).index();
When I call slider_7.reloadSlider(); it would work but I don't know which slider the user clicks and which number it has. So would it be possible to call that with a created string like this:
slider_name='slider_'+$(this).index();
slider_name.reloadSlider();
works not of course. Is there a way to do it?

I would create a dictionary with strings as keys and functions as values. Then, you could have O(1) lookup of the functions you're targeting.
In general, you can do it like so:
// set up your dictionary
var dictionary = {};
// add your functions
dictionary['methodName'] = function() {};
// call the functions
dictionary['methodName']();
So, for your example, you could do:
dictionary['slider_7'] = slider_7.reloadSlider;
dictionary['slider_'+$(this).index()]();

You could trigger it with
window["slider_" + $(this).index()].reloadSlider()
Although, I'm not sure whether your approach is the best. I think I'd go with arrays or with object (as a key-value pairs)

Try this:
slider_name='slider_'+$(this).index();
$("#" + slider_name + " .bx_slider").reloadSlider();

Found a working solution:
eval("slider_" + $(this).index()).reloadSlider();

Its not entirely clear here what you want/are trying to do. What it seems like you want to do is get a programmatic handle on a specific slider when a user clicks a specific part of your page. You do not accomplish this by eval()ing a string...that's what event handlers are for. So create a click event handler and in that event handler
$('#idOfWhatTheUserClicksOn').click(function(event) {
var slider = document.getElementById('#idOfRelatedSlider');
$(slider).bxSlider();
//if you need the current value of the slider you can get that too
var value = slider.value;
});
You could achieve the same with fewer LOC by using a class instead of id's with different handlers, but the concept is the same.

var slider_cache = [
$("#slider_0 .bxslider").bxSlider(),
$("#slider_1 .bxslider").bxSlider(),
$("#slider_2 .bxslider").bxSlider()
];
...
slider_cache[$(this).index()].reloadSlider();

Knockout js: Viewmodel property not being bound

This is my fiddle. http://jsfiddle.net/aaScC/
Please check in the example, the Score property has 3.5 value but it is being displayed as 1. I know the score property is bound to dropdown value so its coming as 1. But i want 3.5 to be displayed. Please help.
var GoalsModel = function (goals) {
var self = this;
self.goals = ko.observableArray(ko.utils.arrayMap(goals, function (goal) { return new Goal(goal) }));
};

The problem is that you just make the select element invisible. You don't want the element at all. You can use bindings if or ifnot to control this.
Here is an updated example: http://jsfiddle.net/waxwing/aaScC/1/ . I wrapped the select inside a span to make it work, but you can also use virtual bindings if you don't like to change your DOM structure.

How to set the unique id for element in the loop with Mootools?

i need to set the unique numeric rel attributes for anchor elements in table with class "tdresult". Im trying to set them in the loop, but im not very good at Javascript and probably don't undestood loops.
$$('.tdresult').each(function(chooseClass) {
var ellen=chooseClass.getElements('a').length;
var eli=chooseClass.getElements('a').each(function(el){
for (i=0; i<ellen; i++){
var elic=el.set('rel',i++); //trying to set numeric ids for anchor els (from 0 to //max (ellen)
}
});
chooseClass.addEvent('mouseenter', function(el) {
infoGet(1,uniqueid); // function that sets the ajax request using unique id from loop
});
});
Can anyone advise me how to do this?

I'm not 100% sure I understand what you're doing, but it looks like you are:
Finding every a element inside each .tdresult element
adding a unique value to the rel attribute to each
adding a mouseenter event to each which uses that rel attribute
If you want to store a unique value, try store and retrieve:
var unique_id = 0;
$$('.tdresult a').each(function(el){
el.store('unique_id',unique_id);
el.addEvent('mouseenter', function(evt) {
infoGet(1,this.retrieve('unique_id'));
});
unique_id++;
});
Though it's possible I'm misunderstanding the task.

This should do what you want if I understand the Question correctly
var offset = 0;
$$('.tdresult').each(function(chooseClass) {
chooseClass.getElements('a').each(function(el){
el.set('rel',offset);
el.addEvent('mouseenter', function(uniqueid) {
return function() {
infoGet(1,uniqueid);
}
}(offset));
offset++
});
});
offset is incremented with the loop but is declared outside of it. Every time the loop runs, it will be the same offset variable being incremented. The loop that was there previously was not necessary.
One question though... why would you set the rel attribute to a number? see http://www.w3schools.com/TAGS/att_a_rel.asp for a list of valid values. Also note that none of the major browsers make use of this attribute anyways. (Epic fail on standards support for everyone)
EDIT
I noticed what you were trying to do with the event listener. I've modified the code to store the current offset in a closure with the event handler. The function in the event handler is immediately run with the current offset. Inside the function this is referred to as uniqueid. The function then returns the real event handler function but maintains use of the uniqueid variable (not offset, but the value of offset at the time the outer function was called).

This is much easier in mootools cause each gives you a counter and as your in a closure at the each loop you doent need to store the id. Check out in mooShell (activate console)
$$('td a').each(function(el, uId){
el.addEvent('mouseenter', function() {
infoGet(1, uId);
});
});