Question

I have a django template which also has a div element that takes in a user_inputed value.
When the value is entered, I call a javascript function say onSubmit(user_input)

<input type="text" class= "inputtext" onKeyPress="return onSubmit(this.value)">

Now in this onSubmit() function which now has the user-inputted value user_input, I want to be able to use url patterns to a direct to a view, like

function onSubmit(user_input) {window.location = "{% url myview user_input %}";}

The problem here is that since user_input is empty when the template is loaded, the url-view reverse lookup gives an error. Is there a way to trigger this lookup only when the onSubmit function is called.

I know form is an alternative, but it just feels like it’ll be an overkill for this situation.

Answer 1

You can get the URL via AJAX:

views.py:

def get_url(request):
    name = request.GET.get('name')
    args = reguest.GET.get('args', [])
    kwargs = request.GET.get('kwargs', {})
    try:
        url = django.core.urlresolvers.reverse(name, args=args, kwargs=kwargs)
    except NoReverseMatch:
        url = None
    return django.http.HttpResponse(url)

urls.py

#...
('^url$', get_url)
#...

js:

function onSubmit(user_input) {
    var args = [user_input];
    jQuery.get('/url', {'args': args}, function(data) {
        var url = data;
        if (url) {
            window.location = url;
        } else {
            alert('fail');
        }
    });
}

Alternatively, if your URL rule is simple enough, you can use some placeholder when resolving and URL, and before submitting the form you should replace it with real input:

var fakeUrl = '{% url myview "%s%" %}';
function onSubmit(user_input) {
    window.location = fakeUrl.replace('%s%', user_input);
}