jquery prop multiple items?

javascript, jquery

Solution

Your code works just fine: http://jsfiddle.net/zerkms/Capvk/

Properties generally affect the dynamic state of a DOM element without changing the serialized HTML attribute

http://api.jquery.com/prop/

So that's why you don't see it changed in html, but it is changed in DOM instead. If you want it to be changed in HTML as well - use `.attr()`

PS: as @ahren mentioned in the comments - it probably makes sense to use `.data()` and `data-xxx` properties

PPS: if you set the value using `.prop()` - you need to get it with `.prop()` respectively

Problem

I'm not sure what I'm doing wrong but for the past 2 hours I've been trying to use prop to change the value of two items in a button. It works for one but not for the other and I have no idea why. html: ``` <input type='button' value='Following' id='btnFollow' dataaction="UnFollow" datatype='topic'> ``` jquery: ``` $("#btnFollow").prop("value", "Follow"); $("#btnFollow").prop("dataaction", "Follow"); ``` The first item changes(`value`) but not the second one(`dataaction`). I have no idea why(other then maybe its too late and my brain is rebelling). According to the documentation I'm doing it correct. I added alerts inbetween each command in case one was failing, but both alerts went off meaning jquery is not crashing or anything when it tries to change the second item. I don't see any spelling mistakes and I tried to daisy chain the commands but still no luck. Any suggestions? entire_code: ``` $(document).ready(function () { $('#btnFollow').click(function() { var topic_id = $(this).attr('datatopic'); var action_type = $(this).attr('datatype'); var action_type_action = $(this).attr('dataaction'); alert(action_type_action); //$("#btnFollow").prop('value', 'Following'); if (action_type_action == 'Follow') { $("#btnFollow").prop({'value': 'Following', 'dataaction': 'UnFollow'}); //$("#btnFollow").prop("value", "Following"); //$("#btnFollow").prop("dataaction", "UnFollow"); $.ajax({ type: 'POST', url: '/follow_modification', async: false, data: { topic: topic_id, action: action_type_action, follow_type: action_type } //complete: function(xmlRequestObject, successString){ // ymmReceiveAjaxResponse(xmlRequestObject, successString); //} }); } else if (action_type_action == 'UnFollow') { $("#btnFollow").prop({'value': 'Follow', 'dataaction': 'Follow'}); //$("#btnFollow").prop("value", "Follow"); //$("#btnFollow").prop("dataaction", "Follow"); $.ajax({ type: 'POST', url: '/follow_modification', async: false, data: { topic: topic_id, action: action_type_action, follow_type: action_type } //complete: function(xmlRequestObject, successString){ // ymmReceiveAjaxResponse(xmlRequestObject, successString); //} }); } }) }); ```

Original source

Related problems