Пример получения данных ajax с помощью beego

1. Что такое AJAX

Asynchronous JavaScript And XML (Асинхронный JavaScript и XML) — это технология веб-разработки, которая позволяет создавать интерактивные веб-приложения.

Аjax — это технология, которая позволяет обновлять часть веб-страницы без перезагрузки всего веб-сайта.

2. Как использовать AJAX

XMLHttpRequest является основой AJAX.

XMLHttpRequest используется для обмена данными с сервером в фоновом режиме. Это означает, что можно обновить часть веб-страницы, не перезагружая весь веб-сайт.

Использование AJAX можно大致 разделить на четыре шага

1. Создание объекта XMLHttpRequest

// js-код для получения объекта XMLHttpRequest (сохраняется как util.js)
function getXmlHttpRequest() {
  var xhr;
  try {
    // Firefox, Opera 8.0+, Safari
    xhr = new XMLHttpRequest();
  }
    // Internet Explorer
    try {
      xhr = new ActiveXObject("Msxml2.XMLHTTP");
    }
      try {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
      }
        alert("Ваш браузер не поддерживает AJAX!");
        возврат false;
      }
    }
  }
  возврат xhr;
}

2. Регистрация функции обратного вызова состояния (функция вызывается каждый раз, когда.readyState XMLHttpRequest объекта изменяется)

// когда xhr.readyState == 4, все шаги выполнены
// когда xhr.state == 200, это означает, что запрос был выполнен правильно
 xhr.onreadystatechange=function(){
  if(xhr.readyState == 4 && xhr.state == 200){
    alert("Запрос выполнен полностью и успешно");
  }
}

3. Установление асинхронного подключения к серверу (по умолчанию асинхронно)

/**
 Метод open(method,url,async)
 Определяет тип запроса, URL и обработку запроса асинхронно.
 method: тип запроса; GET или POST
 url: URL для обработки запроса
 async: true (асинхронно) или false (синхронно)
 Гарантируется через time, чтобы каждый раз отправлять новый запрос
*/
xhr.open("Post", "/detailsU?time=" + new Date().getTime());

4. Выполнение асинхронного запроса

/**
 
*/
xhr.send('{"Index":"'+index +'", "Change":"' + i +'"}');

Следуя этим четырем шагам, вы сможете успешно отправить запрос

Приложение кода:

{{range .PhoneDetails}}  
    <tr onclick="func1(this)">}}
      <th>{{.Id}}</th>
      <th>{{.Name}}</th>
      <th>{{.Price}}</th>
      <th>{{.Repertory}}</th>
      <th>
        <a href="">Редактировать
      </th>
      <script type="text/javascript" src="/static/js/util.js"></script>
      <script type="text/javascript">
        function func1(x) {
          var code = prompt("Введите размер запаса для корректировки:");
          if(code != null && code != "") {
            var i = parseInt(code);
            if(isNaN(i)) {
              alert('Ошибка ввода');
            } else {
              var xhr = getXmlHttpRequest();
              xhr.onreadystatechange = function() {
                if(xhr.readyState == 4 && xhr.state == 200) {
                  alert("Запрос выполнен полностью и успешно");
                }
              }
              var index = x.rowIndex;
              xhr.open("Post", "/detailsU?time=" + new Date().getTime());
              xhr.send('{"Index":"' + index + '", "Change":"' + i + '"}');
              alert('Изменение успешно');
            }
          } else {
            alert('Ошибка ввода');
          }
        }
      </script>
    </tr>
    {{end}}

3. Обработайте запросы AJAX в beego

1. Сначала в models层的models.go создайте структуру данных

/**
 должен соответствовать传入ому строке формата json
 '{"Index":"'+index +'", "Change":"' + i +'"}'
*/
тип Object struct {
 Индекс строки
 Изменить строку
}

2. Зарегистрируйте соответствующие маршруты

/**
 В main.go зарегистрируйте соответствующие маршруты (обратите внимание на настройку соответствующих маршрутов)
 xhr.open("Post", "/detailsU?time=" + new Date().getTime());
 "Post:DoUpdate" используется для регистрации функции, обрабатывающей запросы Post метода на этот URL
*/
beego.Router("/detailsU", &controllers.DetailController{}, "Post:DoUpdate")

3. Напишите соответствующие обработывающие функции в controller

/**
 Обработайте соответствующие запросы в соответствующих функциях
 json.Unmarshal(this.Ctx.Input.RequestBody, ob)
 С помощью json анализируйте передаваемые данные и храните данные в объекте ob
 В app.conf установите copyrequestbody = true
*/
func (this *DetailController) DoUpdate(){
    ob := &models.Object{}
    json.Unmarshal(this.Ctx.Input.RequestBody, ob)
    db, err := sql.Open("mysql", "имя_пользователя:пароль@tcp(IP:3306)/имя_базы_данных")
    result, err := db.Exec("UPDATE имя_таблицы SET поле= ? WHERE id = ?", ob.Change, ob.Index)
    if err != nil{
      beego.Error(err)
      return
    }
       fmt.Println(result)
    }
}

Эти примеры получения данных AJAX с помощью beego, которые я поделился с вами, все, что я хочу предложить. Надеюсь, это даст вам некоторое представление, и я希望大家多多支持呐喊教程。

Заявление: содержимое этой статьи взято из Интернета, авторские права принадлежат соответствующему автору. Контент предоставлен пользователями Интернета в добровольном порядке и загружен самостоятельно. Этот сайт не обладает правами собственности, не做过人工编辑处理， и не несет ответственности за соответствующие юридические вопросы. Если вы обнаружите контент,涉嫌侵犯版权， пожалуйста, отправьте письмо по адресу: notice#oldtoolbag.com (во время отправки письма, пожалуйста, замените # на @), чтобы сообщить о нарушении, и предоставьте соответствующие доказательства. Если факт будет установлен, этот сайт немедленно удалят涉嫌侵权的内容。