如何创建一个像 drupal 7 中的按钮一样的图像按钮？

Question

我希望它如何工作：

我有触发 Ajax 调用的按钮列表（类型按钮），将那个项目添加到列表中。除了按钮看起来很丑外，这完全符合我的要求。

问题：

当我尝试用 "image button" 替换 "button" 时，提交了表单，这不是我想要的。有没有办法将图像添加到不触发提交的按钮？我可以禁用 "image button" 的提交吗？或者我应该在按钮上使用 css 添加图像吗？

"button"、"image button"和"submit"有什么区别？

Answer 1

要使类型 image_button 像在 system.module 中查找并找到 "'#executes_submit_callback' => TRUE", 的按钮一样，将其更改为 false 将阻止在 [=25] 上调用提交功能=].

来自 system.module 的代码：

$types['button'] = array(
    '#input' => TRUE,
    '#name' => 'op',
    '#button_type' => 'submit',
    '#executes_submit_callback' => FALSE,
    '#limit_validation_errors' => FALSE,
    '#process' => array('ajax_process_form'),
    '#theme_wrappers' => array('button'),
);
$types['image_button'] = array(
    '#input' => TRUE,
    '#button_type' => 'submit',
    '#executes_submit_callback' => TRUE,   // <--- This is why submit is triggered
    '#limit_validation_errors' => FALSE,
    '#process' => array('ajax_process_form'),
    '#return_value' => TRUE,
    '#has_garbage_value' => TRUE,
    '#src' => NULL,
    '#theme_wrappers' => array('image_button'),
);

您可能遇到的另一件事是验证错误，要删除它只需添加 "'#validate' => array()" 或者如果您想要运行验证但忽略错误使用 "#limit_validation_errors' => array()"。这也适用于按钮。

这是一个示例，您可以在其中试验上述内容并查看何时触发验证和提交回调。还包含一个复选框以显示何时发生验证错误。

function button_menu()
{
    $items = array();

    $items['button'] = array(
        'title'           => 'Button',
        'page callback'   => 'drupal_get_form',
        'page arguments'  => array('button_form'),
        'access callback' => array(TRUE),
        'type'            => MENU_CALLBACK,
    );

    return $items;
}

function button_form($form, &$form_state)
{
    // Add to prove the point of how validation is working
    $form['checkbox'] = array(
        '#type'          => 'checkbox',
        '#title'         => t('checkbox'),
        '#default_value' => FALSE,
    );

    $form['button'] = array(
        '#id'       => 'button_1',
        '#type'     => 'button',
        '#name'     => 'test1',
        '#value'    => 'test1',
        //'#validate' => array(),  // This line will remove validation completely
        '#limit_validation_errors'  => array(), // This line will run validation but ignore any errors
        '#ajax'     => array(
            'callback' => 'button_test_callback',
            'wrapper'  => 'wrapper',
            'method'   => 'replace',
            'effect'   => 'fade',
        ),
    );

    $form['image_button'] = array(
        '#id'                       => 'image_button_1',
        '#type'                     => 'image_button',
        '#src'                      => '/themes/bartik/logo.png', // hope you still have bartik theme
        '#executes_submit_callback' => FALSE,   // This line removes the submit callback
        //'#validate' => array(),               // This line will remove validation completely
        '#limit_validation_errors'  => array(), // This line will run validation but ignore any errors
        '#ajax'                     => array(
            'callback' => 'button_test_callback',
            'wrapper'  => 'wrapper',
            'method'   => 'replace',
            'effect'   => 'fade',
        ),
    );

    // Just some code to show what button was pressed
    if (array_key_exists('triggering_element', $form_state) &&
        ($form_state['triggering_element']['#id'] == 'button_1' || $form_state['triggering_element']['#id'] == 'image_button_1'))
    {
        $form['markup'] = array(
            '#type' => 'markup',
            '#markup' => '<div id="wrapper"><p>'. $form_state['triggering_element']['#id'] .'</p></div>',
        );
    }
    else {
        $form['markup'] = array(
            '#type' => 'markup',
            '#markup' => '<div id="wrapper"><p>nothing</p></div>',
        );
    }

    $form['submit'] = array(
        '#type'  => 'submit',
        '#value' => 'Submit',
    );

    return $form;
}

function button_test_callback($form, $form_state)
{
    return $form['markup'];
}

function button_form_validate($form, &$form_state)
{
    // To display when validation is triggered
    drupal_set_message('button_form_validate');

    // Only when submit button is pressed we care about this error.
    if ( $form_state['values']['checkbox'] == 0) {
        form_set_error('checkbox', 'checkbox not checked');
    }

}

function button_form_submit($form, &$form_state)
{
    // To display when submit is triggered
    drupal_set_message('button_form_submit');
}

如何创建一个像 drupal 7 中的按钮一样的图像按钮？

How to create an image button that behaves like a button in drupal 7?

drupal-7

drupal-fapi

drupal-ajax

drupal-forms