MDL-componentHandler.upgradeDom (); после вызова AJAX

У меня есть следующие настройки AJAX с использованием Google Lite Design:

first.php

<button class="rhm_add_button" type="button" >
Show
</button>
<div class="rhm_add"></div>


<script>
jQuery(document).ready(function() {
jQuery('.rhm_add_button').click(function(e) {
e.preventDefault();
jQuery.ajax({
type: "GET",
url: "<?php echo admin_url('admin-ajax.php'); ?>",
dataType: 'html',
data: ({ action: 'rhmp_indi_form'}),
success: function(data){
jQuery('.rhm_add').html(data);
},
error: function(data)
{
alert("Error!");
return false;
}
});
});
});
</script>

functions.php

function rhmp_indi_form_callback() {
$template_part_path = 'page-parts/second_page';
get_template_part($template_part_path);
exit;
}
add_action('wp_ajax_rhmp_indi_form', 'rhmp_indi_form_callback');
add_action('wp_ajax_nopriv_rhmp_indi_form', 'rhmp_indi_form_callback');

Second_file.php

 <div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="title" name="title"/>
<label class="mdl-textfield__label" for="title">Name</label>
</div>

Как вы можете видеть, я использую MDL, и когда содержимое загружается через ajax, они не работают должным образом, и я нашел следующее решение от github: https://github.com/google/material-design-lite/issues/1043

Решение было в том, что мне нужно использовать «componentHandler.upgradeDom ();» после вызова AJAX, и я не уверен, как это сделать.

У кого-нибудь есть идеи, как это реализовать?

Спасибо!

2

Решение

Вызов componentHandler.upgradeDom() после того, как вы сделали вставку любых динамических элементов в DOM.

В вашем случае звоните после jQuery('.rhm_add').html(data)

5

Другие решения

       success: function(data){
jQuery('.rhm_add').html(data);
window.componentHandler.upgradeDom();                      },
0

По вопросам рекламы [email protected]