homepage Welcome to WebmasterWorld Guest from 54.196.159.11
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Disable input box using jquery
LinusIT




msg:4479881
 12:13 pm on Jul 29, 2012 (gmt 0)

Hi

I'm trying to recreate an intranet system that I had until my entire world was stolen. I've been hunting around the forums finding my old threads to help me get going.

HTML:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form>
<tr>
<td><input type="text" class="w140" id="ref" name="ref" value="" /></td>
<td><input type="text" class="w80" id="in" name="in" value="" /></td>
<td><input type="text" class="w80" id="out" name="out" value="" /></td>
<td><input type="text" class="w140" id="detail" name="detail" value="" /></td>
</tr>
</form>
</table>


Jquery:

<script type="text/javascript">
$(document).ready(function() {
$("#in").blur(function() {
if ($(this).val() !== '')
$("#out").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
else
$("#out").attr("disabled", "").css({ "border": "1px solid #888" });
});
$("#out").blur(function() {
if ($(this).val() !== '')
$("#in").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
else
$("#in").attr("disabled", "").css({ "border": "1px solid #888" });
});
});
</script>


Here's what used to happen. If you typed a value into "In" then "Out" became disabled and vice versa. DW is telling me I have a coding error where it's highlighted in bold but I can't see it.

Please help, it's driving me mad as I know it used to work (obviously the fixed version).

Thanks

 

Dijkgraaf




msg:4479968
 11:53 pm on Jul 29, 2012 (gmt 0)

You are missing a } before the first else and also a { after it.

<script type="text/javascript">
$(document).ready(function() {
$("#in").blur(function() {
if ($(this).val() !== '')
$("#out").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
}
else
{
$("#out").attr("disabled", "").css({ "border": "1px solid #888" });
});
$("#out").blur(function() {
if ($(this).val() !== '')
$("#in").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
else
$("#in").attr("disabled", "").css({ "border": "1px solid #888" });
});
});
</script>

Fotiman




msg:4480105
 1:32 pm on Jul 30, 2012 (gmt 0)

@Dijkgraaf, no, he's not. There is no opening { of the if. Here's the original code, but formatted to make it easier to read:

$(document).ready(function() {
$("#in").blur(function() {
if ($(this).val() !== '')
$("#out").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
else
$("#out").attr("disabled", "").css({ "border": "1px solid #888" });
});
$("#out").blur(function() {
if ($(this).val() !== '')
$("#in").attr("disabled", "disabled").css({ "border": "1px solid #CCC" });
else
$("#in").attr("disabled", "").css({ "border": "1px solid #888" });
});
});

Fotiman




msg:4480112
 1:35 pm on Jul 30, 2012 (gmt 0)

With that said, "in" is a reserved word in JavaScript, so I would not use that as an ID value, and I wonder if that might be what's causing you problems.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved