ফর্ম এপিআই দিয়ে <বোতামের প্রকার = "জমা দিন"> তৈরি করা হচ্ছে


12

সংহত করার জন্য আমার কাছে একটি ভারী থিমযুক্ত ফর্ম রয়েছে, যার কাঠামোটি নীচে দেখানো হয়েছে। জমা দেওয়ার ব্যতীত আমি বেশিরভাগ অংশের জন্যই আছি।

 <form action="#">
   <fieldset>
     <legend>Authentification</legend>
       <label for="email">Courriel*</label>
       <input type="text" name="email" id="email">
       <label for="password">Mot de passe*</label>
       <input type="password" name="password" id="password" class="last">
       <a href="#" title="Mot de passe oublié?" class="clearfix">Forgot password?</a>
       <button type="submit" class="clearfix"><span>Login</span></button>
   </fieldset>
 </form>

আমি অনেকগুলি বিভিন্ন সংমিশ্রণ চেষ্টা করেছি, দেখা যাচ্ছে বোতাম_প্রকারের মূলের কোনও প্রভাব নেই। সুতরাং আমি এই হ্যাকটি ব্যবহার করেছি , আশা করি এটি আমার সমস্যার সমাধান করবে। হায়, এটি কেবলমাত্র 'টাইপ' বৈশিষ্ট্য (স্পষ্টতই) পরিবর্তন করে এবং উপাদানটি নিজেই নয়। বোতামের ধরণটি অন্যান্য উপাদানগুলিকে ধরে রাখতে পারে, এক্ষেত্রে ব্যাকগ্রাউন্ড চিত্র ধরে রাখতে স্প্যানটির প্রয়োজন হয়, বোতামটির পাঠ্যটি গতিশীল হওয়ায় এটি প্রসারিত হওয়া উচিত।

আমি কীভাবে ফর্ম এপিআই ব্যবহার করে নিম্নলিখিত লাইন মার্কআপটি উত্পন্ন করতে পারি সে সম্পর্কে কারও কি ধারণা রয়েছে?

<button type="submit" class="clearfix"><span>Login</span></button>

ড্রুপাল 8 এর জন্য সাবমিট বাটনটি হয়ে যাবে <botton type="submit">, দেখুন drupal.org/node/1671190
ফিলিপ মাইকেল

উত্তর:


12

ডি 7 এ সুপারিশ করবে:

$form['custom-form'] = array(
  '#prefix' => '<button type="submit">',
  '#suffix' => '</button>',
  '#markup' => '<span>' . t('Login') . '</span>',
);

বোতাম এইচটিএমএল পুনর্নির্মাণ না করে আপনি যদি প্রয়োজন হয় তবে পরে প্রয়োজন পরিবর্তিত ফাংশনে #মার্কআপ প্রতিস্থাপন করতে পারেন।


এই পদ্ধতিটি অটোকম্পেটকে সমর্থন করে না।
পিটার লোজোভিটস্কি

17

সংযোজন হিসাবে, ঠিক যেভাবে কেউ আমার মতো একই সমস্যায় চলে আসে - কোনও ফর্মের গ্রুপে #markupবা #prefix/ #suffixট্রিক ব্যবহার করার সময় , কোনও টাইপ উপাদান উপস্থিত না থাকলেactions সাবমিট কলব্যাক ফাংশনটি বলা হবে নাsubmit । আমার কাজের মত ছিল:

$form['actions']['submit'] = array
(
    '#type' => 'submit',
    '#value' => '',
    '#attributes' => array( 'style' => array( 'display: none' )), // hide the input field
    '#submit' => array( 'my_callback_for_the_form_submit' ),
    '#prefix' => '<button type="submit" class="btn btn-primary">Add <i class="fa fa-plus-square-o">',
    '#suffix' => '</i></button>',
);

আপনি অ্যাকশন গ্রুপ জমা দেওয়ার জন্য কাস্টম এইচটিএমএল ব্যবহার করতে পারেন।


এটি দেওয়া সেরা উত্তরটি ছিল ...
প্রতীপ ঘোষ

5

কিছু কাস্টম ট্যাগ যুক্ত করতে আপনি নিম্নলিখিত স্নিপেটগুলি ব্যবহার করতে পারেন:

// Drupal 6.
$form = array();

// Other elements.

$form['custom-form'] = array(
    '#value' => '<button type="submit" class="clearfix"><span>Login</span></button>',
);
// Drupal 7.
$form = array();

// Other elements.

$form['custom-form'] = array(
    '#markup' => '<button type="submit" class="clearfix"><span>Login</span></button>',
);

এই সত্যিই কাজ করেছেন কিন্তু এটা #markup '#value পরিবর্তে চেষ্টা আমাকে পেতে করেছেন, এবং যে কৌতুক করেনি। ধন্যবাদ ভাই, আমি প্রশংসা করি।
স্টেফগোসেলিন

1
আপনি আপনার ড্রুপাল সংস্করণ সম্পর্কে অবহিত করেন নি। # মূল্য Drupal6 এর জন্য। # মার্কআপটি দ্রুপাল 7-এ প্রবর্তিত
শোয়েব নওয়াজ

হ্যাঁ বন্ধু, আমার খারাপ। আমি সংস্করণ নম্বর উল্লেখ করা উচিত।
স্টেফগোসেলিন

2

কেবল সম্পূর্ণতার জন্য আমি একটি বিকল্প সমাধান পোস্ট করব যাতে এতে ওভাররাইড জড়িত থাকে theme_button( এই ব্লগ পোস্ট থেকে নেওয়া )

প্রথমে buttontypeফর্ম উপাদানটিতে একটি বৈশিষ্ট্য যুক্ত করুন :

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

এবং তারপরে থিম বোতামটি ওভাররাইড করুন:

/**
 * Override of theme_button().
 *
 * Render the button element as a button and the submit element as an input element.
 */
function MYTHEME_button($variables) {
  $element = $variables['element'];
  $element['#attributes']['type'] = 'submit';

  element_set_attributes($element, array('id', 'name', 'value'));  

  $element['#attributes']['class'][] = 'form-' . $element['#button_type'];
  if (!empty($element['#attributes']['disabled'])) {
    $element['#attributes']['class'][] = 'form-button-disabled';
  }

  if (isset($element['#buttontype']) && $element['#buttontype'] == 'button') {
    $value = $element['#value'];
    unset($element['#attributes']['value']);
    return '<button' . drupal_attributes($element['#attributes']) . '>' . $value . '</button>';
  }
  else {
    return '<input' . drupal_attributes($element['#attributes']) . ' />';
  }
}

এটি সমস্যা তৈরি করে তবে ফর্মের একাধিক বাটন যদি দ্রুপাল কোন বোতামটি ক্লিক করেছে তা সনাক্ত করতে অক্ষম।

এটি #after_buildফর্মটিতে একটি কলব্যাক যোগ করে সম্বোধন করা যেতে পারে :

$form['#after_build'][] = 'mymodule_force_triggering_element';

এবং তারপরে বিল্ড ফাংশনে:

function mymodule_force_triggering_element($form, &$form_state) {
  if (isset($form_state['input']['submit'])) {
    $form_state['triggering_element'] = $form['submit'];
  } elseif (isset($form_state['input']['other_button'])) {
    $form_state['triggering_element'] = $form['other_button'];
  }
  return $form;
}

1

আমি অস্কার গমেজ আলকায়েজের জবাব চেষ্টা করেছিলাম কিন্তু আমার ফর্মটি এখনও জমা দেওয়া হচ্ছে না। কার্যকারণ হিসাবে আমি তার সমাধানটি পরিবর্তন করেছিলাম যাতে ইনপুটটি বোতামটির উপরে বসে ছিল তবে স্বচ্ছ ছিল:

$form['actions']['submit'] = array (
    '#type' => 'submit',
    '#value' => '',
    '#attributes' => array( 'style' => 'position: absolute; left: 0; right: 0; top: 0; bottom: 0; border: none; opacity: 0; width: 100%;'), // put input field over the top of button and make transparent
    '#prefix' => '<button type="submit" class="btn btn-primary">Add <i class="fa fa-plus-square-o">',
    '#suffix' => '</i></button>',
);

এইভাবে input[type="submit]আসলটি ক্লিক করা হচ্ছে এবং অ্যাকশনটি ট্রিগার করছে তবে বোতামটি

সম্ভবত বাস্তব জীবনে স্টাইলশীটে সমস্ত সিএসএস রাখার পক্ষে একটি ভাল ধারণা তবে উদাহরণ হিসাবে এখানে কেবল ইনলাইন স্টাইল ট্যাগে রেখে দেওয়া হয়েছে।


0

ড্রুপাল ৮ এ এটি কীভাবে অর্জন করব তা এখানে রয়েছে 8 মূলত আমি একটি নতুন থিমের পরামর্শ তৈরি করি যাতে আমি কাস্টম টুইগ ফাইলের সাহায্যে বোতামটি ওভাররাইড করতে পারি।

আপনার mythemename.theme ফাইলের মধ্যে এই কোডটি যুক্ত করুন:

/**
 * Add twig suggestions for input elements.
 *
 * If a form api element has a data-twig-suggestion attribute, then allow twig
 * theme override, add to suggestions.
 *
 * @param array $suggestions
 *   Current list of twig suggestions.
 * @param array $variables
 *   Every variable of the current element.
 */
function mythemename_theme_suggestions_input_alter(&$suggestions, array $variables) {
  $element = $variables['element'];

  if (isset($element['#attributes']['data-twig-suggestion'])) {
    $suggestions[] = 'input__' . $element['#type'] . '__' . $element['#attributes']['data-twig-suggestion'];
  }
}

আপনার কোডটিতে আপনি যেখানেই আপনার ফর্ম তৈরি করবেন না কেন আপনার জমা বোতামে একটি 'ডেটা-টুইগ-পরামর্শ' বৈশিষ্ট্য যুক্ত করুন:

$form['submit'] = [
      '#type' => 'submit',
      '#value' => t('Submit') . ' >',
      '#attributes' => [
        'data-twig-suggestion' => 'button',
      ],
    ];

এখন আপনি যদি টুইগ ডিবাগ সক্ষম করে থাকেন এবং আপনি সাইটে আপনার বোতামটির এইচটিএমএল উত্সটি পরীক্ষা করেন তবে আপনি একটি নতুন দ্বিখণ্ডিত পরামর্শ দেখতে পাবেন:

<!-- FILE NAME SUGGESTIONS:
   * input--submit.html.twig
   * input--submit--button.html.twig
   x input.html.twig
-->

এখন আপনি একটি ইনপুট তৈরি করতে পারবেন - জমা দিন - বোতাম html.twig ফাইল (আমি এটি mythemename / টেমপ্লেট / ফর্ম_ উপাদানগুলিতে রাখি তবে আপনি যদি চান তবে এটি অন্য কোথাও রাখতে পারেন):

<button{{ attributes }} type='submit'>
    <span class="great-success">Submit</span>
</button>

-3

আরও সঠিক উপায় হ'ল:

$form['submit'] = array(
  '#type' => 'button',
  '#value' => '<span>Login</span>',
);

এটি এর মতো বৈধ HTML উত্পাদন করে:

<button value="&lt;span&gt;Login&lt;/span&gt;" type="submit">
    <span>Login</span>
</button>

... এবং এই পদ্ধতিটি স্বয়ংক্রিয়রূপে এবং অন্যান্য বৈশিষ্ট্যগুলিকে ব্রেক করে না।


1
এটি কোনও <button>ট্যাগ ফেরত দেয় না , কমপক্ষে D7 এ। শেষ লাইন theme_button()অন্তর্ভুক্ত ইন / form.inc হয়return '<input' . drupal_attributes($element['#attributes']) . ' />';
Daniels

আপনি দয়া করে পুনরায় পরীক্ষা করতে পারেন? আমি আমার ওয়ার্কিং কাস্টম মডিউল থেকে এই কোডটি অনুলিপি করেছি।
পিটার লোজোভিটস্কি

যদি এটি আপনার পক্ষে কাজ করে তবে এর অর্থ আপনি একটি কাস্টম থিম বা মডিউলে থিম_বাটনকে ওভাররাইড করেছেন। ড্যানিয়েলস ঠিক আছে।
ফেলিক্স ইভটি

@ ফেলিক্সও, সঠিক! আমি কাস্টম ফাংশন বোতাম overriden করেছি। কাস্টম ফাংশন ব্যতীত এটি করার কোনও অন্য পদ্ধতি আছে কি?
পিটার লোজোভিটস্কি

এই থ্রেডে উপলব্ধ সমস্ত পদ্ধতির একটি ভাল ওভারভিউ রয়েছে।
ফেলিক্স
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.