Develop Reference

Adding "values" to a texfield in jquery/js

When writing a new email, I've got a modal(pop-up window in boostrap) that shows a list of contacts. When I select (through checkboxes) a couple of contacts, the selected ones are written into a checkbox. Problem is I'm just writing the lastone I select instead of all of the selected ones.
If you need further explanation please ask. (Sorry for my english)
$("#tblContacto").on("click", ".ck", function(event){
if($(".ck").is(':checked')) {
selected_index = parseInt($(this).attr("alt").replace("Check", ""));
var contacto = JSON.parse(tbContactos[selected_index]);
$("#txtDestinatarios").val(contacto.Email);
} else {
$("#txtDestinatarios").val("");
}
});

Assuming that you want to add all E-Mails into a textfield with id txtDestinatariosthe cause of your Problem is the usage of the $("#txtDestinatarios").val(); function.
Calling val() with an argument sets (and thus overwrites) the value within the textfield. (See demo at http://api.jquery.com/val/#val2)
You would have to first retrieve the value of the textfield using code like var currentValue = $("#txtDestinatarios").val() and then add/remove the E-Mail from/to the string before setting the resulting string back as the value.

If you want to set all selected items in the checkboxes into Textfiled you can use the following line of code :-
$("#txtDestinatarios").val( $("#txtDestinatarios").val()+ ","+contacto.Email);

crm 2011 xrm.page.getattribute returns null when there is value

I'm not really skillful with JScript but I've written the following code within a function webResource that is supposed to run when the form loads (OnLoad)
var creationDateName = "createdon";
var today = new Date();
var creationDateAttr = Xrm.Page.getAttribute(creationDateName);
if(creationDateAttr!=null)
{
/* Some more code */
}
The problem is that Xrm.Page.getAttribute(creationDateName) returns null when there is a value on the field (the field is not being displayed in form but when looking up it has a value). Funky thing about it is that in my test organization the same code worked like a charm, but when I copied and paste it on the production organization to release the solution it doesn't work properly that's what confuses me a lot. Any idea what might be happening?

You need to use getValue to return the value in the field. Your code is merely checking that the field exists on the Page.
You also need to be aware that in Create mode, these values are not set, so you can't retrieve them. In Update mode they will work. So you need to check that the Page is in Update mode too:
var formType = Xrm.Page.ui.getFormType();
if (formType === 2) // Update
{
var creationDate = Xrm.Page.getAttribute(creationDateName).getValue();
}

it gives you the attribute not the value..
to get the value you have to write code as below
var creationDateAttr = Xrm.Page.getAttribute(creationDateName);
var valueDateAttr=creationDateAttr.getValue();
OR
var creationDateAttrValue = Xrm.Page.getAttribute(creationDateName).getValue();
hope this will help

Silly me, I forgot to add the field I was looking for that's why it return null but thanks to Donal for the answer, actually I was trying to verify if the field was full or was null. Thanks

Delaying select2 opening to fill it with data

I have a dropdown which I'm filling data by calling a function list(), which makes json calls and filters necessary data according to different parameters (It's very complex, and I'm not using the built in ajax feature).
Here's my code:
$("select.mission:visible").on("select2-opening", function() { list(); });
It works flawlessly, except for one little problem - updating the list is done while opening so the updated list doesn't show when you first open the dropdown. On the second open it shows the correct options.
I considered using select2-focus, but it's called twice, in the beginning and in the end. The second call repopulates the list and while the selected option is still highlighted, the value passes down as undefined.
The solution I look for is delaying the opening of the list to let it populate.
Any ideas in this direction or another?

it is a bit late for this question. I have the similar problem as you and I have solve it as below:
$("select.mission:visible").on("select2-open", function() {
$.getJSON("path-to-json", function(data) {
var results_data = [];
$.each(data.feed.entry, function(i, entry) {
results_data.push({'id':entry.id, 'text':entry.text})
});
// if your element select.mission:visible is select convert it to input:hidden
var id = $(this).attr('id') // get old id
var name = $(this).attr('name') // get old name
var oldVal = $(this).val() // get old value
$('select.missions').empty(); // empty select options
$(this).select2('distroy') // destroy current select2 obj
$(this).replaceWith(`<input type='hidden' class='mission' id='${id}' name='${name}'>`) // convert select element to input element
$(this).val(oldVal) // set new input element to previous value
$(this).select2({data:results_data}) // set new option items to new input element select2
$(this).select2('open') // force select2 element to open dropdown
});
});
Because I don't know which version of select2 you're using, but from your code, I assumed you are using select2 version 3.x. For more detail check it at https://select2.github.io/select2/

javascript window.getSelection() circular reference error [duplicate]

See this demo (dependent on selectionchange event which works in Chrome only at this moment): http://jsfiddle.net/fyG3H/
Select some lorem ipsum text and then focus the text input. In the console log you will see that there is a DOMSelection object.
It has an anchorNode value of HTMLBodyElement while it should have one of Text.
I didn't know why this was happening until I tried stringfying the selection object: http://jsfiddle.net/fyG3H/1/
This gives the following error:
Uncaught TypeError: Converting circular structure to JSON
Do you know how I can prevent this circular reference caused by window.getSelection() ?
EDIT
New demo which works in other browsers too but still gives the wrong anchorNode: http://jsfiddle.net/fyG3H/5/
And with JSON.stringify: http://jsfiddle.net/fyG3H/6/
Firefox seem to return an empty {} instead of throwing an error.

You need to invoke toString() on getSelection(). I've updated your fiddle to behave as you'd expect.
var selection;
$('p').bind('mouseup', function() {
selection = window.getSelection().toString();
});
$('input').bind('focus', function() {
this.value = selection;
console.log(selection);
});
See demo
EDIT:
The reason that you're not getting the correct anchor node is that the DOMSelection object is passed by reference and when you focus on the input, the selection gets cleared, thus returning the selection defaults corresponding to no selection. One way you can get around this is to clone the DOMSelection properties to an object and reference that. You won't have the prototypal DOMSelection methods any more, but depending on what you want to do this may be sufficient.
var selection, clone;
$('p').bind('mouseup', function() {
selection = window.getSelection();
clone = {};
for (var p in selection) {
if (selection.hasOwnProperty(p)) {
clone[p] = selection[p];
}
}
});
$('input').bind('focus', function() {
console.dir(clone);
});
See demo

How to check checkbox in each loop

Consider a simple each loop to inspect checked checkboxes:
$(':checkbox').filter(':checked').each(function(){
var name = $(this).val();
});
This code works for checkboxes checked in the original HTML code as
<input type="checkbox" name="test" value="test" checked="checked" />
How to make this jQuery code to work live, to perform the filter process every time a new box is checked or a checked is removed. I want to run the each loop upon any change in the checkbox (checked or unchecked) to return the updated values of currently checked ones.
NOTE: This is a simplified code to express the issue. The intention is not to record the name, but processing checked values in the each loop.

Use click:
$(':checkbox').click(function() {
$(':checkbox').filter(':checked').each(function() {
var name = this.value;
});
});
Notes:
You can avoid query the DOM so many times.
:checkbox is a very slow selector, because it's not a css selector but a jQuery extension.
Don't use jQuery to get this value.
You can improve your code like that:
var $checkboxes = $('input[type="checkbox"]');
$checkboxes.filter(':checked').each(function() {
var name = this.value;
});
Reading resources:
The cost of $(this)
Why we prefix our variables with $ in jQuery

You would need to bind your loop to the change event for the checkboxes.
$(':checkbox').change(function() {
$(':checkbox').filter(':checked').each(function() {
var name = $(this).val();
});
});

Since you're performing a loop, I'm assuming there can be many checked boxes. I'm a little confused why you would be overwriting the name variable each time though, leaving you only with the value of the last checkbox in the end. Instead, I'm providing an array which we push all checked values onto:
// Declare a names variable for storing values
var names;
// Any time a checkbox changes on our form
$("form").on("change", ":checkbox", function(e){
// Empty the names array
names = [];
// Get all checked checkboxes from our form and add their value to our array
$(":checkbox:checked", e.delegateTarget).each(function(){
names.push( $(this).val() );
});
}).find("input:checkbox").trigger("change");
// Method of revealing what we currently have checked
$("#reveal").on("click", function(){
alert( names.join(", ") );
});
Demo: http://jsbin.com/uyecux/2/edit

You need to create an event handler. In jQuery, this might look like this:
$(':checkbox').on('change', function() {
// Execute your code here.
});
See the jQuery documentation here: http://api.jquery.com/on/ for more details on event handling in jQuery.

var $checkboxes = $('input[type=checkbox]')
$checkboxes.click(function (){
$(':checkbox').filter(':checked').each(function(){
var name = $(this).val();
});
});
Try using above function.