We Keep Coding

why data method not working properly while getting ID?

I am trying to get Id using data method of jquery.I saw One example which is working fine.
http://jsfiddle.net/4ajeB/6/
In this example when user click add button generate dynamic rows.there is icon on right side ":" it open pop up .on click edit it give the id of row.Actually In this example developer use this
$('.edit_h').data('originalId', id);
Same thing when I used in my example it gives last value.In other words if you generate three row and click any icon of row it show "tc_3" only.I also used same concept .But I don't know why my output come wrong.
http://jsfiddle.net/4ajeB/7/
$('.edit_h').click(function(){
alert("edit ID:"+$(this).data('originalId'));
})

The problem is that your are calling:
$('.edit_h').data('originalId', id);
every time you add a test case. As you only have one popup menu, you are replacing the data attribute on the menu each time, so the last one added will always be there.
The data attribute should be on the listitem not the popup, then when you click the listitem, retrieve the id and write it into the menu data attribute.
$(document).on("click", ".edit_delete_copyFunctiontiy_h", function (e) {
var id=$(this).data('originalid');
$('.edit_h').data('originalid', id);
$("#Mainnavpanel").popup("open", {
positionTo: $(this)
});
});
$('.edit_h').click(function(){
alert("edit ID: "+ $('.edit_h').data('originalid'));
})
Updated FIDDLE

IPython 2.0 Notebook: where has the "Add Cell Above" button gone, and how do I get it back?

I upgraded to IPython 2.0 today.
Alot of changes seem good, but the button to insert a new cell, above/below seems to be gone.
The option is still in the menu, and I believe the keyboard short cut works.
But the button is gone.
I'm sure there is a way to turn it back on, but the documentation for the new version doesn't seem super complete.
Possibly to turn it back on I need to adjust something in the config.
Which is just python script.
Maybe even tell it to insert a new element, and bind some javascript to it.

These buttons relocated to "Insert" menu. However, it is always good idea to use shortcut commands:
Ctrl+m+- (split cell)
Ctrl+m+a (insert cell above)
Ctrl+m+b (insert cell below)
If you can master them and other basic commands, it will make your notebook workflow really slick. Full list of commands can be found here.

I ended up teaching myself some javascript to do this.
You can make this change in the custom.js file.
which can be found in ~/.ipython/profile_[profile name]/static/custom.
Replace it with the following:
$([IPython.events]).on('app_initialized.NotebookApp', function(){
IPython.toolbar.add_buttons_group([
{
'label' : 'Insert Cell Above',
'icon' : 'fa-arrow-circle-o-up',
'callback': function () {
IPython.notebook.insert_cell_above('code');
IPython.notebook.select_prev();
IPython.notebook.focus_cell();
}
},
{
'label' : 'Insert Cell Below',
'icon' : 'fa-arrow-circle-o-down',
'callback': function () {
IPython.notebook.insert_cell_below('code');
IPython.notebook.select_next();
IPython.notebook.focus_cell();
}
}
]);
$('#insert_above_below').remove()
});
If you have already modified it,
then you can not replace the whole file, obviously, and should merge the appropriate parts.
The buttons will show up on the right.
The single + button for below is also removed.

as now in 5.7.4 version shortcut to create cell above is esc + a

3 product holders jquery onclick image [duplicate]

This question already has an answer here:
Jquery onclick change image - 3 Products holders
(1 answer)
Closed 9 years ago.
I would like to add another button so in total I have 3 buttons instead of 2. How can I do this ? I tried to add a product holder three but then if I click first button 1 and then button 3, both button have the same background image.
Preview: http://gyazo.com/6698586765626a57405f9232baaaf61f.gif
New code(Doesn't work):
$(document).ready(function(){$(".theImage img").click(function(){
var a=$(this).parent().attr("id")=="product-holder1"?"product-holder2"?"product-holder3":"product-holder1";
console.log(a);
$(this).fadeOut();
$("#"+a+" img").fadeIn();
});
});
I have 3 buttons, When they click on one of them it changes the image.. So if user clicks on button 1, it changes image. Is the now clicks the button 2 in case he want to select this one button 1 image goes back to normal.
Website: http://productsgiveaway.com/iphone5s/
I would appreciate some help.
Old code Javascript:
$(document).ready(function () {
$(".theImage img").click(function () {
var a = $(this).parent().attr("id") == "product-holder1" ? "product-holder2" : "product-holder1";
console.log(a);
$(this).fadeOut();
$("#" + a + " img").fadeIn()
})
})

Look at your console when you're clicking on the images. The product-holder# is all messed up. This is your problem. I do now understand why youre setting the variable a like that. Try just using this....
var a = $(this).parent().attr("id");
What youre doing above is the same as saying....
if(id==product-holder1)
a=product-holder2;
else
a=product-holder1;
So youre really reversing them around and thats your problem. Just use the id attribute to get the id of the parent.
EDIT:
Try putting this in for me. Im not positive it will work but I want to see what it does
$(document).ready(function(){
$(".theImage img").click(function(){
$(".theImage img").fadeIn(); //SPOT 1
$(this).fadeOut();
});
});
Glad to see it works. Heres whats happening... You set a background image to the continue picture and then put the select on top. So what you want to do is make sure that every select image is showing when you click it (SPOT 1) in code. Then you use the $(this) selector to get the image that you click and then just hide that. Which will then show the background image you have underneath. This will give you your desired effect. You were actually making it much more complicated than it had to be with pulling the ID's in.

JQuery Open/Close Unique Drawers

I am trying to accomplish what may be a simple task for you. I want it so everytime the user clicks one of the "patients" on the left hand bar, a drawer opens. That drawer will be loaded in a hidden div (display:none) on the page. Each div's id will be the last lastname of the patient. My included fiddle shows all of the same last name for demonstration purposes only, obviously.
But the problem is I don't know how to open a unique drawer for each patient. I guess I need to put a toggle on each patient's li somehow?
Also, if they click another patient in the listing, I would like the current open drawer to close, and open the one they just clicked. Also, if the close button is clicked, obviously close the drawer as well.
I got a single drawer to work with this:
$(".patient").toggle(function(){
$(this)
$('#drawer').slideDown("slow")
}, function(){
$(this)
$('#drawer').slideUp("slow")
});
But obviously that isn't going to work... :(
In the fiddle it is opening a standard "drawer" right now. but really I'd like the data for each named div be loaded in the same form. Please comment if you don't understand.
Here's the fiddle:
http://jsfiddle.net/3veht/1/

Add a data element to your HTML indicating an ID, let's say patient ID in this case:
<li class="patient green" data-patientId="1">Josh Doe<img src="img/next.png"><img class="imgfix" src="img/accept.png"></li>
<li class="patient red" data-patientId="2">John Adams<img src="img/next.png"><img class="imgfix" src="img/cancel.png"></li>
Then in your javascript when you load the data, you can use that ID to generate a page request. I also changed the toggle to a click and slid the previous one up before sliding the new one down. In the fiddle example:
$(".patient").click(function(){
var pat = $(this);
if ($("#drawer").is(":visible"))
$("#drawer").slideUp("fast", function () {
$('#drawer').slideDown("slow")
$("#drawer").load("/echo/js?js=" + pat.data("patientid"));
});
else
{
$('#drawer').slideDown("slow")
$("#drawer").load("/echo/js?js=" + pat.data("patientid"));
}
});
Updated fiddle: http://jsfiddle.net/3veht/6/

Check this fiddle updated....
changes made in code
var divud = $(this).text().split(' ')[1];
$('#drawer').slideDown("slow");
$('#'+divud).removeClass('hidden');
$('#'+divud).slideDown("slow");
JSFIDDLE

jQuery UI multiple selections

see this demo from jquery ui
you have to hold down the Ctrl key to make multiple selections
I really like the code but I don't want to force my visitor to press ctrl key
I want the code to allow multiple selections without holding ctrl key
is this possible?

I asked you a questions in the comments but I'll just write up a simple selection solution so you can see what I was thinking.
So basically you can use the jquery toggle() effect to roll your own selector. When a user clicks you'll add the orange class, when he clicks again it will remove the orange class.
$(document).ready( function() {
$('ul#selectable li').toggle( function() {
$(this).addClass('orange'); }, function() {
$(this).removeClass('orange'); } );
});
Then all your job is to grab all the li elements with the orange class and post them to a form or whatever your end goal is. Haven't checked this code but what your doing is asking for all the li elements within selectable that have the orange value at the end of the class attribute.
With the code below I'm creating a new array and then adding the text() value of each "orange li" into it.
var theSelections = new Array();
$('ul#selectable li[class$="orange"]').each( function(i) {
theSelections[i] = $(this).text();
});

Yes. However, the implementation would have to allow selected items to be deselected when clicked on a second time. You would just need to modify the code slightly to achieve this.
Do a .selectable( 'Enable' ) on all the items.
Then you will need to do a .selectable( 'toggle' ) onClick on all items.
That should do the trick.