Sorry I have kind of strange problem with Magento 2 I am not use to Magento I made a script which should be executed in the Ulimo template in the header of my website, on the network console the script is loaded good, but the script does nothing.
Her my code :
app/code/Vendor/Zipcode/view/frontend/web/js/ajax.js :
javascript
define([
'jquery',
'underscore',
'mage/template',
//'jquery/list-filter'
], function (
,ドル
_,
template
) {
'use strict';
$.widget('Vendor_ZipCode.ajaxCall', {
init: function (options) {
var $element = $(options.element);
var zipurl = options.AjaxUrl;
$('#zip_btn').val("not clicked")
console.log("Test script");
$('#zip_btn').on('click', function () {
console.log("Test click");
$('#zip_btn').val("clicked")
var param = 'ajax=1';
$.ajax({
showLoader: true,
url: zipurl,
data: param,
type: "POST",
dataType: 'json'
}).done(function (data) {
$('#test').removeClass('hideme');
var html = template('#test', {posts: data});
$('#test').html(html);
});
});
}
});
console.log("Test end");
return $.Vendor_ZipCode.ajaxCall;
});
As told my script is present in the network console with 200 status.
But there is neither Test script neither "test end" on the web console and the value of the button is not not clicked
when I click the button nothing happen no log "test click", no value "clicked" and of course no Ajax.
app/code/Vendor/ZipCode/view/frontend/template/ziptemplate.phtml
input type='button' id='zip_btn' name='zip_btn'>
<style>
.hideme{display:none;}
</style>
<script type="text/x-magento-init">
{
"*": {
"Vendor_ZipCode/js/ajax": {
"AjaxUrl": "<?php echo $block->getAjaxUrl(); ?>"
}
}
}
</script>
<div id='test' class="hideme">
<select>
<% _.each(posts, function(text,value) { %>
<option value="<%= value %>"><%= text %></option>
<% }) %>
</select>
</div>
It might be important this template is called in the override theme from ultimo theme like I add the following code into
app/design/frontend/Vendor/Custom/Magento_Theme/layout/default.xml
<referenceContainer name="container_header_top_central_1">
<block class="Vendor\ZipCode\Block\Ziplist" name="zipForm" template="Vendor_ZipCode::ziptemplate.phtml"></block>
</referenceContainer>
I have not any error message, just blank web console, no value in button.
the Ajax.js is in the network console with status 200 OK
I reset the cache of my navigator
I did :
php bin/magento setup:upgrade
php bin/magento cache:flush
php bin/magento setup:static-content:deploy -f
php bin/magento setup:di:compile
I don't understand why there is not effect of the script on the page.
if you have any idea they are more than welcome.
PS: In case of Minus please explain why so that I can update my post
EDIT First clue of solution:
I change :
app/code/Vendor/Zipcode/viez/frontend/web/js/ajax.js
define([
'jquery',
'underscore',
'mage/template',
'mage/url'
//'jquery/list-filter'
], function (
,ドル
_,
template,
url
) {
'use strict';
$(document).ready(function() {
var ajaxurl = url.build('ZipCode/Controller/Zipcode');;
console.log(ajaxurl);
$('#zip_btn').val("not clicked");
$('#zip_btn').on('click', function () {
console.log("Test click");
$('#zip_btn').val("clicked");
$.ajax({
showLoader: true,
url: ajaxurl,
data: param,
type: "POST",
dataType: 'json'
}).done(function (data) {
$('#test').removeClass('hideme');
var html = template('#test', {posts: data});
$('#test').html(html);
});
});
});
});
Like that it's working let say but I still have a problem, how to set the url for Ajax in this case ? Because Ajax url is not working
-
Problem solution : magento.stackexchange.com/questions/286797/…SylwekFr– SylwekFr2019年09月11日 14:52:15 +00:00Commented Sep 11, 2019 at 14:52
1 Answer 1
Try the following command
rm -rf pub/static/frontend/Vendor
After that run the following commands
php bin/magento setup:static-content:deploy -f
php bin/magento cache:flush
-
1Thank you for your reply, unfortunatly it's still not workingSylwekFr– SylwekFr2019年08月27日 13:05:01 +00:00Commented Aug 27, 2019 at 13:05
-
Did you replace the vedor name with your own vendor module?jawaria– jawaria2019年08月27日 16:45:59 +00:00Commented Aug 27, 2019 at 16:45
-
Yes I did but didn't work, I replaced with a ready function which work (in EDIT), I probably won't use widget then, but I still have the problem with Ajax :(SylwekFr– SylwekFr2019年08月28日 08:18:57 +00:00Commented Aug 28, 2019 at 8:18
Explore related questions
See similar questions with these tags.