我在一个Symfony 5项目工作,我想调用一个JavaScript函数,并通过Ajax请求(我从一个控制器)从一个Twig。我创建一个函数phoneverif(),以做一些验证之前的形式验证。.喜欢做一个测试,如果字段是空白的,然后一个警报将出现也验证数据库中的数据的存在。
但是第一个非常简单的测试已经失败了,并且出现了一个错误:
Uncaught ReferenceError: phoneverif is not defined
onclick http://localhost:8000/super_admin/telephone/nouveau:1
下面是我的wig代码:
{% extends 'superadmin.html.twig'%}
{% block body %}
<div class="container-fluid">
<!-- Page Heading -->
<h1 class="h3 mb-4 text-gray-800">Nouveau téléphone</h1>
</div>
<div class="col-md-12">
{% for flashMessage in app.session.flashbag.get('notice') %}
<div class="alert alert-success alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa fa-check"></i>{{ flashMessage }}</h4>
</div>
{% endfor %}
<!-- general form elements -->
<div>
<!-- form start -->
{{ form_start(form)}}
<div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>{{ form_label(form.userGroup) }}</label>
{{ form_widget(form.userGroup) }}
<span class="text-danger">{{ form_errors(form.userGroup) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.protocol) }}</label>
{{ form_widget(form.protocol) }}
<span class="text-danger">{{ form_errors(form.protocol) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.extension) }}</label>
{{ form_widget(form.extension) }}
<span class="text-danger">{{ form_errors(form.extension) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.dialplanNumber) }}</label>
{{ form_widget(form.dialplanNumber) }}
<span class="text-danger">{{ form_errors(form.dialplanNumber) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.voicemailId) }}</label>
{{ form_widget(form.voicemailId) }}
<span class="text-danger">{{ form_errors(form.voicemailId) }}</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>{{ form_label(form.login) }}</label>
{{ form_widget(form.login) }}
<span class="text-danger">{{ form_errors(form.login) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.pass) }}</label>
{{ form_widget(form.pass) }}
<span class="text-danger">{{ form_errors(form.pass) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.confSecret) }}</label>
{{ form_widget(form.confSecret) }}
<span class="text-danger">{{ form_errors(form.confSecret) }}</span>
</div>
<div class="form-group">
<label>{{ form_label(form.serverIp) }}</label>
{{ form_widget(form.serverIp) }}
<span class="text-danger">{{ form_errors(form.serverIp) }}</span>
</div>
</div>
</div>
</div>
<div>
<button type="button" class="btn btn-primary" onclick="phoneverif();">Ajouter</button>
<a class="btn btn-warning" href="{{ path('Les_telephones') }}">Retour</a>
</div>
{{ form_end(form)}}
</div>
</div>
</div>
{% endblock %}
{% block javascripts %}
<script src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
<script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}"></script>
<script type="text/javascript">
function phoneverif() {
if ($("#telephone_extension").val() == '') {
alert('Vous devez saisir une extension');
} else {
if ($("#telephone_dialplanNumber").val() == '') {
alert('Vous devez saisir le dialplan du téléphone');
} else {
if ($("#telephone_login").val() == '') {
alert('Vous devez saisir le login du téléphone');
} else {
if ($("#telephone_pass").val() == '') {
alert('Vous devez saisir le mot de passe du téléphone');
} else {
$.ajax({
type: 'get',
url: Routing.generate('phone_verif', {extension: $("#telephone_extension").val()}),
success: function (data) {
if (data.existe == 1) {
alert('Téléphone non valide');
} else {
$("form").submit();
}
},
error: function() { alert('Erreur lors de l'appel AJAX'); }
});
}
}
}
}
}
</script>
{% endblock %}
功能验证电话:
public function Phoneverif1(Request $request , $extension){
if ($request->isXmlHttpRequest()) {
$em = $this->getDoctrine()->getManager();
$phone = $em->getRepository(Phones::class)->findOneByExtension($extension);
if ($phone) {
$existe = 1;
} else {
$existe = 0;
}
$response = new JsonResponse();
return $response->setData(array('existe' => $existe));
} else {
throw new \Exception('Erreur');
}
}
我的fosjsrrouting配置:
config/packages/routing.yaml:
framework:
router:
utf8: true
# Configure how to generate URLs in non-HTTP contexts, such as CLI commands.
# See https://symfony.com/doc/current/routing.html#generating-urls-in-commands
#default_uri: http://localhost
fos_js_routing:
routes_to_expose: [ phone_verif ]
config/routes/fos_js_routing.yaml:
fos_js_routing:
resource: "@FOSJsRoutingBundle/Resources/config/routing/routing.xml"
routes.yaml:
verification_telephone:
path: /verification/phone/{extension}
controller: App\Controller\TelephoneController::Phoneverif1
options:
expose: true
2条答案
按热度按时间a0zr77ik1#
重新命名函数再试一次我通过重命名函数解决了这个问题。你也试试。
Phoneverif1
{% endblock %}
{% block javascript %}
{% endblock %}
hxzsmxv22#
我回答:https://github.com/FriendsOfSymfony/FOSJsRoutingBundle/issues/383
无论如何,我或多或少遇到了同样的问题,所以我添加了routes.yaml: