Search code examples
javascriptgreasemonkeyfirefox2

Manipulate an input field


Is it possible to remove an input but show the value with Greasemonkey? Or disable it? For example:

<input name="prio" type="text" value="285" disabled="disabled">

I have no idea how to write any userscript. :(

It is for the PC in my company and I am not able to work with jQuery or edit the original source code.

First take a look for better understanding:

The code looks like that: http://jsfiddle.net/gv3XF/

But I want it like that: http://jsfiddle.net/gv3XF/1/

I tried it with Stylish but with that, I can only hide the input. I still need the value for result.

The input always is called name="prio" but the number from the value is changing.

What I want is to "kill" the input but show the result of the value.


Solution

  • You can't just "kill" the input. If you do, then the necessary data might not get sent to the server when you submit the form.

    So, hide the input and show its value. Here's a complete script that uses the awesome power of jQuery to do that:

    // ==UserScript==
    // @name        Make Priority more user friendly
    // @include     http://YOUR_SERVER.COM/YOUR_PATH/*
    // @require     http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
    // @grant       GM_getValue
    // ==/UserScript==
    //--- The @grant is to subvert a huge design flaw, introduced with GM version 1.
    
    var oldInput    = $("input[name=prio]");
    var priorityVal = oldInput.val ();
    oldInput.after ('<b id="gmPriorityValue">' + priorityVal + '</b>');
    oldInput.remove ();
    
    $("#gmPriorityValue").before ('<input type="hidden" name="prio">');
    $("input[name=prio]").val (priorityVal);
    

    Change the @include value to match your site(s).

    Note that you can't change an <input>s type, so we delete the old input and create a new one with the same value, but hidden.



    Re: do that without jquery? the pc has no internet connection:

    You're going to sneak the script file onto the PC, right? :)
    Download and sneak jQuery onto it too. With the jQuery file and the userscript file in the same folder, change the @require line to:

    // @require     jquery.min.js
    

    Then the script will install just fine, no internet connection required.



    Re: maybe the easiest way is to disable the input field:

    Okay, the script to do that is:

    // ==UserScript==
    // @name        Make Priority more user friendly
    // @include     http://YOUR_SERVER.COM/YOUR_PATH/*
    // @grant       GM_getValue
    // ==/UserScript==
    
    var oldInput = document.querySelector ("input[name=prio]");
    oldInput.setAttribute ("disabled", "disabled");
    

    Update:

    Extremely crucial information was omitted from the question -- mainly that this is meant for Firefox 2.0(!!!) and Greasemonkey 0.8. Given that, change the code for the last script to:

    var oldInput = document.getElementsByName ("prio");
    oldInput[0].setAttribute ("disabled", "disabled");
    

    It should work, but it's impossible to test, and compatibility tables don't even cover such an obsolete browser.