Как отправить HTML-данные в колбу без формы - PullRequest
Новая
       24

Как отправить HTML-данные в колбу без формы

0 голосов
/ 17 февраля 2019

я знаю, что вы легко можете отправить данные формы в колбу с помощью вызовов типа $.ajax() в jquery, но мне нужен способ отправки данных на сервер колбы с помощью элемента, скажем, тега <p>.

Например: test.html 

<p data-rep='testentry' class='qtemp'>Entry00</p>
<p data-rep='testentry01' class='qtemp'>Entry01</p>

index.js 

$(document).ready(function(){
    $('.qtemp').on('click',function(){
        var layout = $(this).data('rep');

        $.ajax({
            url: 'workstation',
            type: 'POST',
            data: layout
        });     
    });
});

main.py 

@app.route('/workstation',methods=['GET','POST'])
def workstation(data):
    layout = data

    return render_template('station.html',target=layout)

Запуск этого приложения:

  1. Не отображает шаблон station.html
  2. Не печатает переменную layout, содержащую отправленные данные (я добавил оператор печати, но он не работал, даже попытался написать егов файл)

Что я пробовал:

  1. В index.js, заменить data: layout на data: JSON.stringify(layout), затем в .main.py, заменить layout = dataс layout = request.args.get('data').

Излишне говорить, что все это не работает

Примечание: использование html-формы не вариант

1 Ответ

0 голосов
/ 17 февраля 2019

Вам нужно изменить ajax, чтобы получать JSON результаты с маршрута Python.Кроме того, для хранения данных, возвращаемых при вызове ajax, необходимо получить доступ к значениям по имени ключа, используя flask.request.args:

В index.js: 

$(document).ready(function(){
   $('.qtemp').on('click',function(){
    var layout = $(this).data('rep');
     $.ajax({
      url: "/workstation",
      type: "get",
      data: {layout: layout},
      success: function(response) {
        var new_html = response.html;
      },
     });     
  });
});

В main.py: 

@app.route('/workstation')
def workstation():
  layout = flask.request.args.get('layout')
  return flask.jsonify({'html':flask.render_template('station.html',target=layout)})

Редактировать: вы можете сохранить значение, полученное из запроса ajax в flask.session, и перенаправить на нужную страницу.Для этого создайте дополнительный маршрут для сохранения значения, а затем используйте window.location.replace в теле функции ajax success:

In index.js: 

$(document).ready(function(){
  $('.qtemp').on('click',function(){
    var layout = $(this).data('rep');
    $.ajax({
      url: "/update_layout",
      type: "get",
      data: {layout: layout},
      success: function(response) {
        window.location.replace('/workstation');
      },
    });     
  });
});

In main.py

import string, random

app.secret_key = ''.join(random.choice(string.printable) for _ in range(20))
#secret_key needed for session implementation

@app.route("/update_layout")
def update_layout():
  flask.session['layout'] = flask.request.args.get('layout')
  return flask.jsonify({'success':'True'})

@app.route('/workstation', methods=['GET'])
def workstation():
  return flask.render_template('station.html',target = flask.session['layout'])
...