Javascript- Disable listview column once clicked

wylduc

New Member
I have a asp listview that displays a column of addresses and states. Only certain addresses are allowed to be editted. In my document.ready I put an image next to ones that are allowed to be editted.When one span with the address is clicked on I have javascript that checks if it can be editted. If it's edittable it puts the text in a textarea box and allows a user to edit it. What I'm struggling with is once one address is clicked and being editted I want to disable any other address from being able to be editted. I created a custom attribute called 'enabled' that after the javascript checks to see if the address is edittable it checks to see what the value of this custom attribute is and if it is true then don't show the textarea if its false show the text area. I then realzied this isn't quite right as its not disabling the other textarea's from opening upHaving trouble with getting this to work. I'm open to other methods of only allowing the textarea to be displayed only one at a time as well. Is their a way to ignore the click functions on the 'originalType' span if a textarea is showing?\[code\]<asp:ListView ID="table" ><LayoutTemplate> <table > <thead> <th> Address Type </th> <span> <th> State </th> </span> </thead> <tbody> <tr id="item" runat="server" /> </tbody> </table></LayoutTemplate><ItemTemplate> <tr class="abc"> <td width="40%"> <span class="originalType" id="original"> <span class="TypeSpan" style="display:none;"><%# DataBinder.Eval("AddressType")%></span> </span> <span data-enabled="false" class="EditType" style="display:none"> <textarea class="edit"><%# DataBinder.Eval("AddressType")%> </textarea> <input type="button" class="button3 buttonSave" id="buttonSave" value="http://stackoverflow.com/questions/15709940/Save" /> <input type="button" class="button3 buttonCancel" id="buttonCancel" value="http://stackoverflow.com/questions/15709940/Cancel" /> </span> </td> <td width="45%"> </td> </span> </tr> </ItemTemplate> <EmptyItemTemplate> </EmptyItemTemplate> <EmptyDataTemplate> </EmptyDataTemplate></asp:ListView>\[/code\]Checks to see if type is eddittable and then goes into show method see below\[code\]$('.originalType').each(function() { $(this).bind("click", function() { var $this = $(this), $currentRow = $this.closest('td'), $currentEditSpan = $currentRow.find('.EditType'), $currentType = $this.children('.TypeSpan').text(); if ($currentType == "2") { show($(this)); } }); });\[/code\]This enables the span with textarea and buttons to show\[code\] function show(theSource) { var original = theSource; var newEditBox = theSource.siblings('.EditType');if (newEditBox.attr("data-enabled" == 'false')) { newEditBox.attr("data-enabled",true) original.hide(); newEditBox.show();}else {} \[/code\]}
 
Back
Top