views:

97

answers:

4

How can I disable an input-field with jQuery using GM if the url contains text?

I tried

$(document).ready( function() {
    if($("url:contains('text')")){
        $(".input[id=field-owner]:disabled");
    }
    else {
        $(".input[id=field-owner]:enabled");
    }
});

I don't know what I did wrong. And I also don't know whether url:code is a regular expression to use.

Update

Hi again, thanks for your time putting in this. I guess it's easier to ask/answer how to call an alert when the url contains e.g. "newthread".

So, we have got a url(e.g.): http://forum.jswelt.de/newthread.php?do=newthread&f=1 , and an input-field with id="subject" and a label for "subject". If the url contains "newthread" the input-and label-element should be hidden. Following code works, but not for me. The console says nothing and won't alert though.


var url = window.location.href 
url = "http://forum.jswelt.de/newthread.php?do=newthread&f=1";
    var pos = url.search(/newthread/); 
    if(pos >= 0)
        alert("tadaa");
    else
        alert("mist");

:(

Thank you to all helping me.

Edit inserts the final solution


if (location.href.indexOf("text") != -1) {
$('#fieldname').attr("disabled", true); 
+3  A: 

Throw away that snippet. Should be like

(function($){
  $(document).ready(function(){
     var url = window.location.href;

     if(/text/g.test(url)){
        $('#field-owner').attr('disabled', 'disabled');
     }
     else{
        $('#field-owner').removeAttr('disabled');
     }
  });
})(jQuery);

edit

"$ not defined" means you either aren't loading the jQuery library or $ gets overwritten. I put the whole snippet into a self-executing anonymous function which will fix the last issue at least.

jAndy
Hm, understand what you mean - thanks for that. Console says $ not defined. I'll figure it out. ;-) Ty
Faili
Add this line above your javascript:<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
gt
jQuery library is already included. ;-)
Faili
Re: `Console says $ not defined.`... Remember that loading jQuery into Greasemonkey does NOT make it visible to Firebug's console, except inside the GM script (because of the sandbox). So, it's very important to note if `$` is not defined inside the GM script or just when using Firebug. (Some pages use another instance of jQuery on their own. Some pages do not. Only in the former case will Firebug see it for you (outside the GM script).)
Brock Adams
A: 

try something like this..

function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

and then you can do

if (getUrlVars()["text"] != null) {
    $input.attr('disabled','disabled');
}
Martin Lazar
I didn't get the impression that he was after the query string specifically, but even if he was a regular expression is still the way to go.
meagar
You're right with the query string - I didn't notice that..
Martin Lazar
+1  A: 

url:contains isn't valid JavaScript, and it will cause a parse error. As with all jQuery selectors, you're actually passing a string for jQuery to parse:

$("url:contains('text')")

That said, url: is not a valid jQuery selector. jQuery isn't actually the solution to this problem; instead use window.location.href to get the current URL, and test it with a regular expression:

if (window.location.href.match(/text/)) {
  // ...
}

The next problem is your code to enable/disable your input boxes. It's... beyond broken. Firstly, if the element has an ID, just use the #id selector. Secondly, selectors like :enabled are for filtering elements - pulling more specific elements from the DOM to work with. They don't actually change the state of the elements they select.

You want something like this:

if (window.location.href.match(/text/)) {
    // apply disabled attribute
    $('#field-owner').attr('disabled', 'disabled');
} else {
    // remove disabled attribute if it exists
    $('#field-owner').removeAttr('disabled');
}

Update

RE: $ not defined:

You aren't including the jQuery library in your page. Make sure you've downloaded jQuery and successfully included it in your page via a <script> tag.

meagar
Hm, understand what you mean - thanks for that. Console says $ not defined. I'll figure it out. ;-)Ty
Faili
jQuery library is already included. Ty for the tip.
Faili
A: 

Try this simple thing . Not sure this will suite you. But it will find for the word 'text' and disable the input

​$('input').change(function(){
    var temp = $(this).val();
    var searchTerm = 'text';
    if(temp.search('text') > 0 || temp.search(searchTerm) == 0){
        $("#field-owner").attr('disabled', 'disabled');
    }
});​​​​​​

just change the variable searchTerm and use it. Works for me. DEMO

Aakash Chakravarthy
I believe he was interested in disabling the box depending on whether the URL of the page contained a search term, not the box itself.
meagar
That's so true. Thanks for your help.
Faili