একটি মডেল উইন্ডোতে ফর্মগুলি দেখান [বন্ধ]


23

আমার একটি ফর্ম রয়েছে এবং আমি ড্রুপাল using ব্যবহার করছি a যখন কোনও ব্যবহারকারী কোনও লিঙ্ক ক্লিক করেন তখন পপআপে এই ফর্মটি দেখাতে হবে। এরপরে পপ আপ উইন্ডোটিতে ব্যবহারকারী ফর্মটি পূরণ করতে সক্ষম হবেন। আমি রঙিনবক্স বা মডেল বা যে কোনও কিছু ব্যবহার করতে পারি। আমি কেবল জানতে চেয়েছিলাম কোনটি ভাল বিকল্প এবং ড্রুপালের জন্য আমার কাছে কী বিকল্প রয়েছে।

উত্তর:


11

আমি বর্তমানে 2 টি ভাল বিকল্প সম্পর্কে জানি: আইফ্রেমে (উদাহরণস্বরূপ কালারবক্সে) এবং সিটিউলস। কোন বিকল্পটি ব্যবহার করতে হবে তা পরিস্থিতি নির্ভর করে। আমি অনুমান করি যে এই তথ্যটি আমি সিটিউলস মোডাল এইচটিএমএল ফাইলে পেয়েছি তা মূল পার্থক্যটি নিয়ে আসে:

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

আমার এই বিষয়ে সিটিউলগুলির সাথে ব্যক্তিগত অভিজ্ঞতা নেই তাই আমি এতে আর কিছু যুক্ত করতে পারি না, তবে আমি কয়েকটি প্রকল্পে আইফ্রেম পদ্ধতিটি প্রয়োগ করেছি। সাম্প্রতিকতম এক আমি ব্যবহার Colorbox সঙ্গে তৈরি করা কয়েক ফর্ম দেখানোর জন্য প্লাগিন ওয়েব-ফর্ম একটি পপআপে মডিউল। কিছু আগ্রহ থাকলে আমি এখানে কিছু উদাহরণ কোড যুক্ত করব।

ফর্মের লিঙ্ক:

<a class="colorbox_form" href="'.url('node/5').'">'.t('Send message').'</a>

একটি পপআপে লিঙ্কিত ঠিকানা খুলতে জাভাস্ক্রিপ্ট কোড:

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});
}

থিম টেমপ্লেট ফাইলটিতে:

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();
  }
}

আমি জাভাস্ক্রিপ্ট ব্যবহার করে লিঙ্কগুলিতে 'colorbox = true' সংযুক্ত করেছি যাতে জাভাস্ক্রিপ্ট বন্ধ থাকা ব্যবহারকারীরা সাধারণ টেম্পলেট সহ ফর্মটি দেখতে পান। Iframe টেমপ্লেটে কেবল বার্তা, শিরোনাম এবং সামগ্রী মুদ্রিত আছে।

এটি ইতিমধ্যে কাজ করে, তবে আমি ওয়েবফর্মগুলির সাথে একটি ইস্যুতে ছড়িয়ে পড়ে: ফর্মটি জমা দেওয়ার পরে 'colorbox = true' সংরক্ষণ করা হয়নি। এটি ঠিক করার জন্য আমার প্রচেষ্টা:

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');
  }
}

8

সিটিউলগুলি ব্যবহার করুন যা কোনও ব্যবহারকারী কোনও লিঙ্কে ক্লিক করলে মডেলটিতে ফর্ম সন্নিবেশ করতে পারে।

দয়া করে নীচের টিউটোরিয়ালটি দেখুন: সিটিউলস এবং ড্রুপাল 7 সহ একটি পপ-আপ মডেলে একটি ফর্ম sertোকান যা কয়েক ধাপে এই প্রক্রিয়াটিকে সহজতর করে।

মূলত আপনাকে hook_menu()নিজের মডেল ফর্মের জন্য আপনার কলব্যাকটি সংজ্ঞায়িত করতে হবে :

$items['mymodule/%ctools_js'] = array(
  'page callback' => 'mymodule_callback',
  'page arguments' => array(1),
  'access callback' => TRUE,
  'type' => MENU_CALLBACK,
);

তারপরে একটি লিঙ্ক জেনারেটর তৈরি করুন যা এইচটিএমএল কোডটি দেয়:

/**
 * 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>';
}

সুতরাং এটি আপনার পৃষ্ঠার কলব্যাকে ব্যবহার করা যেতে পারে, যেমন:

/**
 * 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');
}

ব্যবহারকারীর লিঙ্কটিতে ক্লিক করা হলে, এটি হয় /mymodule/ajaxবা /mymodule/nojs(ক্ষেত্রে ক্ষেত্রে nojs) অনুরোধ করে , সুতরাং নিম্নলিখিত কলব্যাক একটি মডেল তৈরি করতে পরিচালনা করে:

/**
 * 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');
  }
} 

এখন আপনাকে কেবল নীচের মতো একটি ফর্ম তৈরি করতে হবে এবং এটির হ্যান্ডলারটি জমা দিতে হবে:

/**
 * 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);
}

এটি পরীক্ষা করতে, এখানে যান: /mymodule/pageযেখানে আপনাকে 'ম্যাজিকাল মডেল' লিঙ্কটি দেখতে হবে যা একবার ক্লিক করলে আপনাকে মোডাল ফর্মটি দেখায়।


6

আমি রঙিনবক্সের পরিবর্তে মোডাল ফর্মটি দেখতে শুরু করব। এটি বিশেষত বিদ্যমান কারণ ফর্মগুলির সাথে রঙিনবক্স ব্যবহার করা সত্যিই খারাপ কাজ করে।

মডেল ফর্মে, টোটুলস ব্যাকগ্রাউন্ডে সমস্ত কাজ করে, যার ফর্ম হ্যান্ডলিংয়ের উপযুক্ত সমর্থন রয়েছে যা কেবল রঙবক্সে অন্তর্ভুক্ত নয়। এর অর্থ হ'ল যদি আপনাকে একটি অসমর্থিত ফর্ম "মডেল" করতে হয় তবে আপনি সর্বদা জানেন যে কুলসকে ধন্যবাদ এর পিছনে একটি শক্ত API রয়েছে যা আপনি পরিবর্তে স্যুইচ করতে পারেন।

নতুন ফর্ম সমর্থন সহ প্যাচ ফাইল করার জন্য বোনাস পয়েন্টগুলি লিখলে। ;)


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

আমি কোটোল অংশের দিকে আরও ভারী ওজনের আমার উত্তর আপডেট করেছি, যদিও যদি মডেল ফর্ম নিজেই সমস্যাটি সমাধান করে তবে আরও ভাল।
লেথারিয়ন

Seconded। কালারবক্স মডিউল পৃষ্ঠাটি এখন এর জন্য কালারবক্স ব্যবহার না করার পরামর্শ দেয়; এই বৈশিষ্ট্যটির জন্য সমর্থনটি কালারবক্সের ২.x সিরিজ থেকে সরানো হয়েছে।
প্যাট্রিক কেনি

2

আমি দেখি যে সরল ডায়ালগ মোডাল মধ্যে ফরম প্রদান একটি দুর্দান্ত উপায়। এটিতে মূলত jQuery UI ব্যবহার করার সুবিধা রয়েছে।

আপনাকে যা করতে হবে তা হ'ল কিছু অতিরিক্ত তথ্য সহ ফর্মটির একটি লিঙ্ক সরবরাহ করা। এটি ক্লাস এবং রিল ট্যাগগুলির উপর ভিত্তি করে একটি সহজ পদ্ধতি বা আরও সূক্ষ্ম সুরক্ষার জন্য একটি থিম পদ্ধতি সরবরাহ করে। আমি এটি দুটি উপায়ে করেছি:

  1. মেনু গুণাবলী প্রয়োজনীয় রিল ও শ্রেণী ট্যাগ প্রদান মডিউল।
  2. থিম_মেনু_ লিঙ্ক ফাংশন রেন্ডার মেনু লিঙ্ক ওভাররাইড করতে।

হ্যালো. আপনি কি আপনার উত্তরটি কিছুটা প্রসারিত করতে পারেন? কি প্রয়োজন rel এবং ক্লাস ট্যাগ? প্রযোজ্য হলে এগুলি কোথায় স্থাপন করা যেতে পারে?
মোআট

@ কিউইনভিক্টোরিয়া, আপনি কীভাবে সরল ডায়ালগ মডিউলটি ব্যবহার করে পপআপ উইন্ডোতে ফর্ম খুলতে পারেন তার উদাহরণ দিতে পারেন?
এআরুন

2

আপনার যে মডিউলটি প্রয়োজন তা হ'ল https://drupal.org/project/popup_forms , তবে এটি প্রয়োগ করার জন্য আপনাকে কিছু প্রোগ্রামিং করতে হবে (যেমন এটি কেবল অ্যাডমিন ইন্টারফেসের মাধ্যমে কনফিগার করা যায় না)।


তবে মডিউলটির স্থিতিশীল প্রকাশ নেই।
মাথনকুমার

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