EzDevInfo.com

How to check a radio button with jQuery ?

I try to check a radio button with jQuery. Here's my code:

<form>
    <div id='type'>
        <input type='radio' id='radio_1' name='type' value='1' />
        <input type='radio' id='radio_2' name='type' value='2' />
        <input type='radio' id='radio_3' name='type' value='3' /> 
    </div>
</form>

And the JavasScript:

jQuery("#radio_1").attr('checked', true);

Doesn't work:

jQuery("input[value='1']").attr('checked', true);

Doesn't work:

jQuery('input:radio[name="type"]').filter('[value="1"]').attr('checked', true);

Doesn't work:

Do you have another idea? What am I missing?

Django set default form values

I have a Model as follows

class TankJournal(models.Model):
  user = models.ForeignKey(User)
  tank = models.ForeignKey(TankProfile)
  ts = models.IntegerField(max_length=15)
  title = models.CharField(max_length=50)
  body = models.TextField()

I have a modelform as follows for that model

class JournalForm(ModelForm):
    tank = forms.IntegerField(widget=forms.HiddenInput()) 

    class Meta:
        model = TankJournal
        exclude = ('user','ts')

I want to know how to set the default value for that tank hidden field.. Here is my function to show/save the form so far

def addJournal(request, id=0):
    if not request.user.is_authenticated():
        return HttpResponseRedirect('/')

    #
    # checking if they own the tank
    #
    from django.contrib.auth.models import User
    user = User.objects.get(pk=request.session['id'])

    if request.method == 'POST':
        form = JournalForm(request.POST)
        if form.is_valid():
            obj = form.save(commit=False)

            #
            # setting the user and ts
            #
            from time import time
            obj.ts = int(time())
            obj.user = user

            obj.tank = TankProfile.objects.get(pk=form.cleaned_data['tank_id'])

            #
            # saving the test
            #
            obj.save()

    else:
        form = JournalForm()

    try:
        tank = TankProfile.objects.get(user=user, id=id)
    except TankProfile.DoesNotExist:
        return HttpResponseRedirect('/error/')

    form.tank = id
    return render_to_response('ajax/tank_addJournal.html', {'form': form}, context_instance=RequestContext(request))

thanks!

javascript - change form action based on selection?

I'm trying to change the form action based on the selected value from a dropdown menu...

Basically, the html looks like this:

<form class="search-form" id="search-form" method="post" accept-charset="UTF-8" action="/search/user">
<select id="selectsearch" class="form-select" name="selectsearch">
<option value="people">Search people</option>
<option value="node">Search content</option>
</select>

<label>Enter your keywords: </label>
 <input type="text" class="form-text" value="" size="40" id="edit-keys" name="keys" maxlength="255" />

<input type="submit" class="form-submit" value="Search" id="edit-submit" name="search"/>
</form>

If "people" is selected, (which it is by default), the action should be "/search/user", and if content is selected, the action should be "/search/content"

I'm still searching around, but haven't been able to find out how to do this...

Is there a JavaScript MVC (micro-)framework? [closed]

Are there any client-side JavaScript MVC (micro-)frameworks?

I have a rather complicated HTML form, and it would benefit from the MVC pattern.

I imagine a good solution would provide the following:

• Model and View update the Controller when values change (Observer pattern)
• Populate the model from the form data when the page loads
• Populate the form from the model when the model changes

Ajax, comet, JSONP and all that jazz are serious overkill.

How do you overcome the html form nesting limitation?

I know that xhtml doesn't support nested form tags and I have already read other answers
here in stackoverflow regarding this subject, but I still haven't figured out an elegant solution to the problem.

Some say you don't need it and that they can't think of a scenario were this would be needed. Well, personally I can't think of a scenario that I HAVEN'T needed it.

Let's see a very simple example:

You are making a blog app and you have a form with some fields for creating a new post and a toolbar with "actions" like "Save", "Delete", "Cancel".

<form   
 action="/post/dispatch/too_bad_the_action_url_is_in_the_form_tag_even_though_conceptually_every_submit_button_inside_it_may_need_to_post_to_a_diffent_distinct_url"  
method="post">  

    <input type="text" name="foo" /> <!-- several of those here -->  
    <div id="toolbar">
        <input type="submit" name="save" value="Save" />
        <input type="submit" name="delete" value="Delete" />
        <a rel='nofollow' href="/home/index">Cancel</a>
    </div>
</form>

Our objective is to write the form in a way that doesn't require javascript, just plain old html form and submit buttons.

Since the action url is defined in the Form tag and not in each individual submit button, our only option is to post to a generic url and then start "if...then...else" to determine the name of the button that was submitted. Not very elegant, but our only choice, since we don't want to rely on javascript.

The only problem is that pressing "Delete", will submit ALL the form fields on the server even though the only thing needed for this action is a Hidden input with the post-id. Not very big deal in this small example, but I have forms with hundreds (so to speak) of fields and tabs in my LOB applications that (because of requirements) have to submit everything in one-go and in any case this seems very inefficient and a waste. If form nesting was supported, I would at least be able to wrap the "Delete" submit button inside it's own form with only the post-id field.

You may say "Just implement the "Delete" as a link instead of submit". This would be wrong in so many levels, but most importantly because Side-effect actions like "Delete" here, should never be a GET request.

So my question (particularly to those that say they haven't needed form nesting) is What do YOU do? Is there any elegant solution that I'm missing or the bottom line is really "Either require javascript or submit everything"?

Clear form fields with jQuery

I want to clear all input and textarea fields in a form. It works like the following when using an input button with the reset class:

$(".reset").bind("click", function() {
  $("input[type=text], textarea").val("");
});

This will clear all fields on the page, not just the ones from the form. How would my selector look like for just the form the actual reset button lives in?

Google Chrome form autofill and its yellow background

I have design problem with Google Chrome and its form autofill function. If Chrome remembers some login/password it changes a background color to a yellow one.

Here are some screenshots:

How to remove that background or just disable this autofill ?

Disabling Chrome Autofill

I have been running into issues with the chrome autofill behavior on several forms.

The fields in the form all have very common and accurate names, such as "email", "name", or "password", and they also have autocomplete="off" set.

The autocomplete flag has successfully disabled the autocomplete behavior, where a dropdown of values appear as you start typing, but has not changed the values that Chrome auto-populates the fields as.

This behavior would be ok except that chrome is filling the inputs incorrectly, for example filling the phone input with an email address. Customers have complained about this, so it's verified to be happening in multiple cases, and not as some some sort of result to something that I've done locally on my machine.

The only current solution I can think of is to dynamically generate custom input names and then extract the values on the backend, but this seems like a pretty hacky way around this issue. Are there any tags or quirks that change the autofill behavior that could be used to fix this?

Two submit buttons in one form

I have two submit buttons in a form. How do I determine which one was hit serverside?

Submitting a form by pressing enter without a submit button

Well I am trying to submit a form by pressing enter but not displaying a submit button. I don't want to get into JavaScript if possible since I want everything to work on all browsers (the only JS way I know is with events).

Right now the form looks like this:

<form name="loginBox" target="#here" method="post">
    <input name="username" type="text" /><br />
    <input name="password" type="password" />
    <input type="submit" style="height: 0px; width: 0px; border: none; padding: 0px;" hidefocus="true" />
</form>

Which works pretty well. The submit button works when the user presses enter, and the button doesn't show in Firefox, IE, Safari, Opera and Chrome. However, I still don't like the solution since it is hard to know whether it will work on all platforms with all browsers.

Can anyone suggest a better method? Or is this about as good as it gets?

Enter key press event in JavaScript

I have a form with two text boxes, one select drop down and one radio button. When the enter key is pressed, I want to call a javascript function (User defined), but when I press it, the form is submitted.

How do I prevent the form from being submitted when the enter key is pressed?

Rails hidden field undefined method 'merge' error

I wanna do something like this in rails

Here is what I have so far in rails:

<%= form_for @order do |f| %>
  <%= f.hidden_field :service, "test" %>
  <%= f.submit %>
<% end %>

But then I get this error:

undefined method `merge' for "test":String

How can I pass values in my hidden_field in rails?

What characters are allowed in email address?

I'm not asking about full email validation.

I just want to know what are allowed characters in user-name and server parts of email address. This may be oversimplified, maybe email adresses can take other forms, but I don't care. I'm asking about only this simple form: user-name@server (e.g. wild.wezyr@best-server-ever.com) and allowed characters in both parts.

I know that a-z, 0-9, _, -, . (dot) can be used but is there more allowed characters? Maybe +, $?

Hope I made my question clear ;-).

Update: if some characters are allowed, but only at specific positions (as is dot in user-name), then this character is just allowed. I don't want full email address validation but simple list (set) of all characters allowed at user-name and server parts. Please don't bother with additional contraints for special positions of specific characters. If character is allowed under some/any/none conditions then it is in the list of allowed chars.

Update2: please give as simple answer as possible - just describe available characters, do not just give link to specs.

Update3: Here is my motivation for exactly such question as I asked... My question may seem stupid as I ask for very simplified conditions of valid email addresses. But with proper answer and very simple implementation of validation with only checking if allowed characters were provided (or not) I will accept all valid email addresses (and many invalid too). I think it is more user friendly than the opposite (implement sophisticated validator that rejects some proper email addresses). Consider + that Dan Herbert and laura are talking about in comments. This is just example of too constrained implementation of email address validation - and that is annoying!

Second reason is just curiosity - what are the allowed characters taken apart from other validation constraints?

Jquery - Create hidden form element on the fly

What is the simplest way to dynamically create a hidden input form field using jquery?

CSS selector for text input fields?

How can I target my form input fields of type 'text' using CSS selectors?

For example- I want all the input text fields in my form to have the same font. Is there a way of doing this without assigning each field to a class?