DjangoBB LoFi version

Полная версия: ajax

1 2 3 4

Ferroman

Янв. 3, 2011 23:40:31

Извиняюсь за задержку.
Хотел разв́рнуто написать, но честно говоря, сил нету всё расписывать.

Вам надо передавать не только поля формы, а и путь екшена вместе с каждой формой. Иначе как указать путь по которому должен уйти каждый post?
Напрямую передать файлы используя джаваскрипт нельзя - надо использовать фрейм.
Изобретать велосипед не обязательно — есть jquery form.

Igor Shmigoff

Янв. 9, 2011 17:41:44

Ferroman
Спасибо! У меня и ща нет сил… Праздники…
Но от слов к вопросу.
Спасибо. Чувствую то что Вы предложили с jquery form это то что нужно. Но что то тыкаюсь мыкаюсь, а результат - либо ничего не работает, либо опять тупо редиректит на внешнюю страницу и всё - т.е. весь контейнер “пропадает” (в этом случае все загружается на сервер).

Пишу форму след вида:

<form action="http://localhost:8000/My_project/upload/panorama" method="post" enctype="multipart/form-data" >{% csrf_token %}
    {{ form.as_p }}<br>
    <input type="submit" name="submit" value="Upload" id="submit">
</form>

Далее, ввожу параметры формы (title, выбираю файл, жму кнопку). Еще раз напишу, в шаблоне у меня пока что:

$('#panorama_add').click(function () {
                                      $("#contentContainer").load("http://localhost:8000/My_project/upload/panorama/");
                                      });

Мне не понятно, как с помощью того что Вы написали в ссылке сделать то что мне хотелось бы. Т.е. что то типа так

$('#panorama_add').click(function () {
                              $("#contentContainer").load("http://localhost:8000/My_project/upload/panorama",
							function(){
								$('#submit').click(function(){
									$('#contentContainer').ajaxForm(function(){   // Т.е. по клику я хочу в этот же #contentContainer вывести сообщение, или подставить html страничку
										alert("Thank you for your comment!");
									});
								});
								});
							}
					);

Но, ясен пень, возникает ошибка и ниче не заливается.
Знаю, задача простая, но что то туплю. В #contentContainer появляется http://localhost:8000/My_project/upload/panorama, и далее я сабмичу форму, хочу чтоб файл панорамы загрузился и чтоб либо форма очистилась (чтоб продолжить загружать панорамные виды), либо чтоб появилось в этом же #contentContainer что то типа ok.html с кодом а-ля <h2>Ок, загрузилось!</h2>
Спасибо, Ferroman, что не устали от меня и помогаете.

Igor Shmigoff

Янв. 9, 2011 23:42:14

Ferroman

Пытаюсь сделать так:

$(document).ready(function(){
    $('#panorama_add').click(function(){               // При клике по #panorama_add загружаю страницу с формой загрузки в контейнер #contentConatainer
        $("#contentContainer").load("http://localhost:8000/My_project/upload/panorama", 
            function(){
                         $('#forma').ajaxForm(function(){   // Пытаюсь прибайндиться, как в http://jquery.malsup.com/form/#getting-started
               alert('Uploaded OK!!!');                           
            });
        });
    });
});

а той же форме присвоил id=“forma”:

<form id="forma" action="http://localhost:8000/My_project/upload/panorama" method="post" enctype="multipart/form-data" >{% csrf_token %}

Вылетает ошибка: Error: Form elements must not have name or id of “submit”
Что не так?
Может еще в представлении не совсем то. При загрузки формы у меня стоит редирект на страницу /ok(в случае успеха заливки файла):

def save_view_panorama(request):      
    if request.method == 'POST': 
        form = PanaromaForm(request.POST, request.FILES)
        if form.is_valid():  
            form.save()
            return HttpResponseRedirect('ok/')   // Вот здесь!
    else:
        form = PanoramaForm()
    template = 'Upload/form_upload_panorama.html'
    return render_to_response(template, 
                              {'form': form},
                              context_instance=RequestContext(request))

Хотелось бы чтоб этот редирект - т.е. переход на урл ../ok произошел именно в #contentContainer.
Спасибо!

Igor Shmigoff

Янв. 11, 2011 21:28:25

Так, с тем как в контейнер поместить ту или иную страницу после отправки формы в тот же контейнер, в котором была форма разобрался:

$('#panorama_add').click(function(){
                $("#contentContainer").load("http://localhost:8000/My_project/upload/panorama", function(){
                    $(document).ready(function(){
                        $("#forma").ajaxForm(function(){
                            $("#contentContainer").load("http://localhost:8000/My_project/upload/panorama/ok");
                        });
                    });
                });
            });

Но! В моей форме есть проверка данных на сервере. Т.е. файл загрузки файла выглядит так:

        {% block content %}<h1> Upload panorama {{ object }} </h1>
        {% if form.errors %}                                                    // Здесь и начинается проверка
        <p style="color: black; background: magenta; ">            // В зависимости от незаполненных полей над ними появляется надпись. Красным
            Requered fields: {{ form.errors|pluralize }} 
        </p>
        {% endif %}
        <form id="forma" action="http://localhost:8000/My_project/upload/panorama/" method="post" enctype="multipart/form-data">
            {% csrf_token %}
            {{ form.as_p }}
            <br>
            <input type="submit" value="Upload">
        </form>

Но теперь, не важно заполнил ты поля или нет, при нажатии на кнопку на Upload в #contentContainer загружается ../ok.
Как сделать так, чтоб форма с required fields сваливалась в тот же #contentContainer?

Спасибо!