Не загруженная функция javascript

#javascript #jquery #symfony

#javascript #jquery — jquery — запрос #symfony #jquery

Вопрос:

У меня есть подобный код в моем проекте symfony 2.

 {% extends 'DomestosAdminBundle::layout.html.twig' %}
{% block title %}DomestosAdminBundle:Parent:edit{% endblock %}

{% block content %}
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
    $(function() {
      var availableTags = {{json|raw}};
      $( "#tags" ).autocomplete({
        source: availableTags
      });
    });
  </script>
  <script type="text/javascript">
    $(function() {
      function addSchool(value) {
        $.ajax({
          url: '{{path("parent/school/add",{"parent_id": parent.id})}}'
          data: {
            tags: value
          },
          success: function(){ alert("Hello world"); }
          error: function(){ alert("Chyba píčo"); }
        });
      }
    });
  </script>
  {{form_start(form)}}
    <div id="semeno">
      {% for school in parent.school %}
        {{school.name}} <a href="{{path('parent/school/delete', {'parent_id': parent.id, 'school_id' : school.id})}}"><i class="fa fa-times-circle fa-2x"></i></a>
      {% endfor %}
    </div>
    {{form_rest(form)}}
    <input id="tags" name="tags"> amp;nbsp;<a style="cursor: pointer;" onclick="addSchool($('#tags').val()); return false;"><i class="fa fa-plus"></i></a>
    <button type="submit" class="btn btn-success pull-right">Save</button>
  {{form_end(form)}}
{% endblock %}
  

Первая функция availableTags работает нормально, но консоль firebug выдает ошибку, что она не может найти действие addschool. Я знаю, что она размещена неправильно, используя тег 2 раза, но я довольно сильно запутался в этом JS.

Комментарии:

1. Переместить addSchool функцию из $(function() { .. }); области видимости. Нравится <script type="text/javascript">function addSchool(value) { ....}</script>

2. После того, как я это сделал, это дало мне SyntaxError: missing } after property list data: { , похоже <script type="text/javascript"> function addSchool(value) { $.ajax({ url: '{{path("parent/school/add", {"parent_id": parent.id})}}' data: { tags: value }, success: function(){ alert("Hello world"); } error: function(){ alert("Chyba píčo"); } }); } </script>

Ответ №1:

Это из-за видимости вашей addSchool функции. Она объявлена внутри $(function()) , поэтому ее невозможно увидеть за пределами этого блока.

Создать:

 <script type="text/javascript">

function addSchool(value) {
            $.ajax({
                url: '{{path("parent/school/add", {"parent_id": parent.id})}}',
                data: {
                    tags: value
                },
                success: function(){ alert("Hello world"); },
                error: function(){ alert("Chyba píčo"); }
            });
        }

</script>
  

вашего

 <script type="text/javascript">
$(function() {
function addSchool(value) {
            $.ajax({
                url: '{{path("parent/school/add", {"parent_id": parent.id})}}'
                data: {
                    tags: value
                },
                success: function(){ alert("Hello world"); }
                error: function(){ alert("Chyba píčo"); }
            });
        }
    });
  

Это в основном тот же код, но без $(function()) оболочки, которая вам не нужна в данном случае, потому что вы просто объявляете функцию.

ПРИМЕЧАНИЕ: объявление функций в глобальном пространстве имен может рассматриваться как плохая практика

Комментарии:

1. Я точно скопировал ваш код, и это выбрасывает меня: SyntaxError: missing } after property list data: {

2. проверьте сейчас, я добавил запятую после редактирования параметра url: а также после успеха