Saya memiliki formulir dan saya menggunakan Drupal 7. Saya harus menunjukkan formulir ini dalam sembulan ketika pengguna mengklik tautan. Pengguna kemudian harus dapat mengisi formulir sementara di jendela sembulan. Saya bisa menggunakan apa saja seperti Colorbox atau modals atau apa pun. Saya hanya ingin tahu mana pilihan yang lebih baik dan opsi apa yang saya miliki untuk Drupal.
Ada 2 pilihan bagus yang saya tahu saat ini: iframe (dalam colorbox misalnya) dan CTools. Pilihan mana yang digunakan tergantung dari situasinya. Saya kira informasi ini saya temukan di file modal.html CTools memunculkan perbedaan utama:
CTools menyediakan modal sederhana yang dapat digunakan sebagai popup untuk menempatkan formulir. Ini berbeda dari kerangka kerja modal normal karena tidak melakukan tugasnya melalui iframe. Ini adalah keuntungan dan kerugian. Iframe hanya membuat halaman normal di sub-browser dan mereka dapat melakukan hal mereka. Itu membuatnya lebih mudah untuk menempatkan halaman dan formulir sewenang-wenang dalam modal. Namun, iframe tidak terlalu bagus dalam benar-benar mengkomunikasikan perubahan ke halaman utama, jadi Anda tidak dapat membuka modal, minta ia melakukan beberapa pekerjaan, dan kemudian memodifikasi halaman.
Saya tidak punya pengalaman pribadi dengan CTools tentang hal ini jadi saya tidak bisa menambahkan hal lain untuk itu, tapi saya sudah menerapkan metode iframe di beberapa proyek. Dalam yang terbaru saya menggunakan plugin Colorbox untuk menunjukkan beberapa formulir yang dibuat dengan modul Webform dalam popup. Saya akan menambahkan beberapa kode contoh di sini jika ada minat.
Tautan ke formulir:
<a class="colorbox_form" href="'.url('node/5').'">'.t('Send message').'</a>Kode Javascript untuk membuka alamat yang ditautkan dalam sembulan:
if ($('a.colorbox_form').length > 0) {
var link = $("a.colorbox_form").attr('href');
link = link.concat('?colorbox=true');
// colorbox=true is attached for later use (read below).
$("a.colorbox_form").attr('href', link);
$("a.colorbox_form").colorbox({iframe:true, width:500, height:450});
}Dalam file templat tema:
function mytheme_preprocess_page(&$variables) {
// Different template and additional stylsheet for colorbox content.
if (isset($_GET['colorbox']) && $_GET['colorbox'] == TRUE) {
$variables['theme_hook_suggestions'] = array('page__iframe'); // page--iframe.tpl.php
drupal_add_css(path_to_theme() .'/iframe.css');
$variables['styles'] = drupal_get_css();
}
}Saya lampirkan 'colorbox = true' ke tautan menggunakan javascript sehingga pengguna dengan javascript dimatikan akan melihat formulir dengan templat normal. Templat iframe hanya memiliki pesan, judul, dan konten yang dicetak.
Ini sudah berfungsi, tapi saya mengalami masalah dengan Webforms: 'colorbox = true' tidak dipertahankan ketika formulir dikirimkan. Upaya saya untuk memperbaikinya:
function mymodule_form_alter(&$form, &$form_state, $form_id) {
if (isset($_GET['colorbox']) && $_GET['colorbox'] == TRUE) {
// The id-s of the forms that are possibly shown within a popup.
$form_ids = array('webform_client_form_2', 'webform_client_form_4');
if (in_array($form_id, $form_ids)) {
$form['#submit'][] = 'mymodule_webform_submit';
}
}
}
function mymodule_webform_submit(&$form, &$form_state) {
//drupal_set_message('<pre>'.var_export($form_state['redirect'], TRUE).'</pre>');
if (!isset($form_state['redirect'])) {
$form_state['redirect'] = array($_GET['q'], array('query' => array('colorbox' => 'true')));
}
else {
$form_state['redirect'][1]['query'] = array('colorbox' => 'true');
}
}Gunakan CTools yang bisa memasukkan formulir ke modal ketika pengguna mengklik tautan.
Silakan periksa tutorial berikut: Masukkan formulir ke dalam modal pop-up dengan CTools dan Drupal 7 yang menyederhanakan proses ini dalam beberapa langkah.
Pada dasarnya Anda perlu menentukan hook_menu()callback Anda untuk formulir modal Anda:
$items['mymodule/%ctools_js'] = array(
'page callback' => 'mymodule_callback',
'page arguments' => array(1),
'access callback' => TRUE,
'type' => MENU_CALLBACK,
);kemudian buat penghasil tautan yang mengembalikan kode HTML:
/**
* Helper function to make a link.
*/
function _mymodule_make_link($link_text = '') {
// Set a default value if no text in supplied.
if (empty($link_text)) {
$link_text = 'Magical Modal';
}
return '<div id="magical-modal-link">' . l($link_text, 'mymodule/nojs', array('attributes' => array('class' => 'ctools-use-modal'))) . '</div>';
}sehingga dapat digunakan dalam panggilan balik halaman Anda, misalnya:
/**
* An example page.
*/
function mymodule_page() {
// Load the modal library and add the modal javascript.
ctools_include('modal');
ctools_modal_add_js();
return _mymodule_make_link('Magical modal');
}Ketika pengguna mengklik tautan, itu membuat permintaan ke /mymodule/ajaxatau /mymodule/nojs(jika ada nojs), jadi panggilan balik berikut ini membuat modal:
/**
* Ajax menu callback.
*/
function mymodule_callback($ajax) {
if ($ajax) {
ctools_include('ajax');
ctools_include('modal');
$form_state = array(
'ajax' => TRUE,
'title' => t('MyModule Modal Form'),
);
// Use ctools to generate ajax instructions for the browser to create
// a form in a modal popup.
$output = ctools_modal_form_wrapper('mymodule_form', $form_state);
// If the form has been submitted, there may be additional instructions
// such as dismissing the modal popup.
if (!empty($form_state['ajax_commands'])) {
$output = $form_state['ajax_commands'];
}
// Return the ajax instructions to the browser via ajax_render().
print ajax_render($output);
drupal_exit();
}
else {
return drupal_get_form('mymodule_form');
}
} Sekarang Anda hanya perlu membuat formulir dan menyerahkan penangannya seperti di bawah ini:
/**
* Drupal form to be put in a modal.
*/
function mymodule_form($form, $form_state) {
$form = array();
$form['new_link_text'] = array(
'#type' => 'textfield',
'#title' => t('Link text'),
);
$form['submit'] = array(
'#type' => 'submit',
'#value' => t('Submit'),
);
return $form;
}
/**
* Drupal form submit handler.
*/
function mymodule_form_submit(&$form, &$form_state) {
// Generate the new link using the submitted text value.
$link = _mymodule_make_link($form_state['values']['new_link_text']);
// Tell the browser to close the modal.
$form_state['ajax_commands'][] = ctools_modal_command_dismiss();
// Tell the browser to replace the old link with the new one.
$form_state['ajax_commands'][] = ajax_command_replace('#magical-modal-link', $link);
}Untuk mengujinya, buka: di /mymodule/pagemana Anda akan melihat tautan 'Modal Ajaib' yang akan memperlihatkan kepada Anda formulir modal setelah diklik.
Saya akan mulai melihat formulir Modal , alih-alih Colorbox. Secara khusus ada karena menggunakan Colorbox dengan formulir berfungsi sangat buruk.
Dalam bentuk modal, Ctools melakukan semua pekerjaan di latar belakang, yang memiliki dukungan yang tepat untuk penanganan formulir yang tidak termasuk dalam Colorbox. Itu juga berarti bahwa jika Anda perlu "modal" bentuk yang tidak didukung maka Anda selalu tahu bahwa berkat Ctools ada API yang solid di belakangnya yang dapat Anda alihkan.
Poin bonus untuk mengajukan tambalan dengan dukungan formulir baru jika Anda menulisnya. ;)
Saya menemukan bahwa Dialog Sederhana adalah cara terbaik untuk menyediakan formulir di Modals. Ini memiliki keuntungan menggunakan jQuery UI yang ada di inti.
Yang perlu Anda lakukan adalah memberikan tautan ke formulir dengan beberapa informasi tambahan. Ini memberikan metode sederhana berdasarkan kelas dan tag rel, atau metode tema untuk kontrol yang lebih baik. Saya telah melakukan ini dalam dua cara:
sumber
Modul yang Anda butuhkan adalah https://drupal.org/project/popup_forms , tetapi Anda perlu melakukan beberapa pemrograman untuk menerapkannya (mis . Modul itu tidak bisa hanya dikonfigurasikan melalui antarmuka admin).
sumber