greasemonkey script to select radio button

Question

Hi all, i'm new here. i've a question related to greasemonkey.

A page contain multiple radio buttoned values and one choice is to made, this correct choice option is hidden within the page

the radio buttons are present in the form whose structure is

<form name="bloogs" action="/myaddres.php" id="bloogs" method="post" >

then the hidden field as

<input type=hidden value="abcd" name="ans">

then all the radio button values are followed as

<input  type="radio" id="r1" name="opt" value="abcd"> abcd
<input  type="radio" id="r2" name="opt" value="efgh"> efgh
<input  type="radio" id="r3" name="opt" value="ijkl"> ijkl

and so on

thus i need the button with value=abcd be 'checked' as soon as the page loads. Thanks

Answer 1

I haven't done greasemonkey, but this may help:

use jQuery and do

$('[value="abcd"]').click()

Good luck.

Answer 2

There are some ways you can use:

1 You can pre-select it by putting in selected="selected" like this:

<input type="radio" id="r1" name="opt" value="abcd" checked="checked" /> abcd

2 You can use jQuery to do it easily (I don't know whether it will be applicable in terms of greasmonky though)

$(function(){
  $('input[value="abcd"]').attr('checked', 'checked');
});

3 You can loop through all elements and selected the one with raw javascript

var form = document.getElementById('bloogs');

for(var i=0; i<form.elements.length; i++)
{
  if (form.elements[i].type == 'radio')
  {
    if (form.elements[i].value == 'abcd')
    {
      form.elements[i].setAttribute('checked', 'checked');
      break;
    }
  }
}

Update:

This uses jquery and selects a radio after reading the value from hidden field:

$(function(){
  $('input[value="' + $('#hidden_field_id').val() + '"]').attr('checked', 'checked');
});

Or with raw javascript:

var form = document.getElementById('bloogs');
var hidden_value = document.getElementById('hidden_field_id').value;

for(var i=0; i<form.elements.length; i++)
{
  if (form.elements[i].type == 'radio')
  {
    if (form.elements[i].value == hidden_value)
    {
      form.elements[i].setAttribute('checked', 'checked');
      break;
    }
  }
}

Update 2:

As per the name, here is how you can go about:

$(function(){
  $('input[value="' + $('input[name="ans"]').val() + '"]').attr('checked', 'checked');
});

Answer 3

If you're trying to use jQuery with GreaseMonkey you're going to have to get good at writing delayed and try / retry type code. You need to start with something like this:

var _s1 = document.createElement('script');
_s1.src = 'http://www.ghostdev.com/jslib/jquery-1.3.2.js';
_s1.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(_s1);

That loads jQuery into your page. Next, you set something up that operates like so:

function dojQueryStuff() {
  if (jQuery == undefined) {
    setTimeout(dojQueryStuff, 1000);
  } else {
    // In here is where all of my code goes that uses jQuery.
  }
}

dojQueryStuff();

You've defined a function that'll check for jQuery's presence, and if it doesn't find it try again 1 second later. That gives the script time to load. Please note, if you don't use your own copy of jQuery the one listed in my example does not provide a $ variable. At the end of the script I have var $j = jQuery.noConflict();, so you'll access the jQuery functionality via $j or jQuery.