درجلسه قبلی درخصوص نحوه ایجاد یک blade template و همچنین نحوه نمایش اطلاعات در blade  ها پرداختیم. سراغ ساختارهای کنترلی از جمله if,else و حلقه ها رفتیم و در پایان قول دادیم که با معرفی یک پکیج برای استفاده از تگ های html  در blade ها بپردازیم . با ما همراه باشید.

معرفی laravel collective

Laravel collective سازمانی است که به منظور سازمان دهی، نگهداری و توسعه اجزا و کامپوننت هایی که از هسته لاراول حذف شده اند، تلاش می کند. آنها عاشق لاراول بوده و در توسعه و ترویج لاراول تلاش زیادی می کنند.
یکی از کامپوننت های حذف شده از هسته لاراول، استفاده از syntax منحصر بفرد تگ های html در blade ها بوده که در این آموزش به این موارد می پردازیم.

نصب laravel collective

برای نصب laravel collective کافیست در فایل compose.json در قسمت require نام پکیج مورد نظر رو اضافه کرده و با استفاده از ترمینال خود به پوشه پروژه رفته و دستور composer update رو اجراء کنیم.

"require": {
    "laravelcollective/html": "5.1.*"
}

سپس در دایرکتوری config فایل app.php رو بازکرده و در آرایه های providers و aliases کدهای زیر رو اضافه می کنیم.

  'providers' => [
    // ...
    CollectiveHtmlHtmlServiceProvider::class,
    // ...
  ],
  'aliases' => [
    // ...
      'Form' => CollectiveHtmlFormFacade::class,
      'Html' => CollectiveHtmlHtmlFacade::class,
    // ...
  ],
حالا می تونیم به راحتی از امکانات laravel collectiveدر blade ها استفاده کنیم.

معرفی تگ ها

تگ فرم

پس از اضافه کردن پکیج فوق استفاده از تگ فرم در blade ها به صورت زیر امکان پذیر می شود:
{!! Form::open(array('url' => 'foo/bar')) !!}
    //
{!! Form::close() !!}
درصورت استفاده از کد فوق، متد POST به صورت پیش فرض در نظر گرفته می شود. البته می توانید برای استفاده از متدهای دیگر از روش زیر استفاده کنید.
{!! Form::open(array('url' => 'foo/bar', 'method' => 'put'))  !!}
همچنین می تونید از فرمهایی جهت اشاره به route ها و یا controller های خاص استفاده کرد.
{!! Form::open(array('route' => 'route.name')) !!}
{!! Form::open(array('action' => 'Controller@method')) !!}
 و یا پارامترهای مشخصی رو به route ها و یا controller  ها ارسال کنید. به کد زیر توجه کنید:
{!! Form::open(array('route' => array('route.name', $user->id))) !!}
{!! Form::open(array('action' => array('Controller@method', $user->id))) !!}
درصورت آپلود فایل نیز می بایست مطابق کد زیر عمل کنید:
{!! Form::open(array('url' => 'foo/bar', 'files' => true)) !!}

لیبل ها

برای نوشتن یک لیبل در Blade  ، اگر لیبل شما بدون Attributes بود به صورت زیر
{!! Form::label('email', 'E-Mail Address')!!}
و در صورت داشتن Attributes مانند کلاس و یا ای دی بدین روش عمل کنید.
{!! Form::label('email', 'E-Mail Address', array('class' => 'awesome'))!!}
پارامتر اول نام تگی است که برای آن لیبل تعریف شده ، پارامتر دوم عنوان لیبل و پارامتر سوم مربوط به Attributes مرتبط با لیبل می باشد.

تگ های Input

برای تگ های Input  با type=”text” اگر بدون مقدار پیش فرض بود به صورت زیر

{!! Form::text('username')!!}
و در صورت داشتن مقدار پیش فرض به صورت زیر عمل کنید.
{!! Form::text('email', 'example@gmail.com')!!}

پارامتر اول نام و پارامتر دوم مقدار پیش فرض آن می باشد.

همچنین برای تگ های Input  با type=”password” :

{!! Form::password('password', array('class' => 'awesome'))!!}
و برای سایر Input  ها :
{!! Form::email($name, $value = null, $attributes = array()) !!}
{!! Form::file($name, $attributes = array()) !!}
{!! Form::number('name', 'value')!!}
{!! Form::date('name', CarbonCarbon::now())!!}
بدین صورت عمل کنید.

 Checkbox & radio button

می توانیم از checkox ها و radio button ها به صورت زیر در blade ها استفاده کنیم:
{!! Form::checkbox('name', 'value') !!}
{!! Form::radio('name', 'value') !!}
و در صورتیکه انتخاب به صورت پیش فرض نیاز داشتید به صورت زیر عمل کنید.
{!! Form::checkbox('name', 'value', true)!!}
{!! Form::radio('name', 'value', true) !!}

تگ های Drop Down List

روش کد نویسی تگ فوق به صورت زیر می باشد:
{!! Form::select('size', array('L' => 'Large', 'S' => 'Small'))!!}
پارامتر اول متد select نام و پارامتر دوم مقدار drop down  می باشد.
حالا اگر که خواستید یک مقدار به صورت پیش فرض انتخاب شده باشد ، به روش زیر عمل کنید:
{!! Form::select('size', array('L' => 'Large', 'S' => 'Small'), 'S')!!}
و درصورت نیاز به یک palce holder از این روش استفاده کنید:
{!! Form::select('size', array('L' => 'Large', 'S' => 'Small'), null, ['placeholder' => 'Pick a size...'])!!}

ایجاد list groupe

{!! Form::select('animal', array(
'Cats' => array('leopard' => 'Leopard'),
'Dogs' => array('spaniel' => 'Spaniel'),
))!!}
ایجاد drop down list  با مقادیر یک محدوده خاص
{!! Form::selectRange('number', 10, 20)!!}
و در نهایت می توانید برای button ها به صورت زیر عمل کنید:
Form::submit('Click Me!')
باتوجه به موارد فوق یک نمونه فرم ثبت نام ساده با استفاده از تگ های فوق رو می تونید مشاهده کنید.
{!! Form::open([‘method’ => ‘POST’, ‘class’ => ‘form-horizontal’]) !!}
<div class=”form-group @if($errors->first(‘username’)) has-error @endif”>
{!! Form::label(‘username’, ‘userName:’, [‘class’ => ‘col-sm-3 control-label’]) !!}
<div class=”col-sm-9″>
{!! Form::text(‘username’, null, [‘class’ => ‘form-control’, ‘required’ => ‘required’]) !!}
<small class=”text-danger”>{{ $errors->first(‘username’) }}</small>
</div>
</div>
<div class=”form-group @if($errors->first(’email’)) has-error @endif”>
{!! Form::label(’email’, ‘Email address’, [‘class’ =>’col-sm-3 control-label’]) !!}
<div class=”col-sm-9″>
{!! Form::email(’email’, null, [‘class’ => ‘form-control’, ‘required’ => ‘required’, ‘placeholder’ => ‘eg: foo@bar.com’]) !!}
<small class=”text-danger”>{{ $errors->first(’email’) }}</small>
</div>
</div>
<div class=”form-group @if($errors->first(‘nationalCode’)) has-error @endif”>
{!! Form::label(‘nationalCode’, ‘nationalCode’, [‘class’ => ‘col-sm-3 control-label’]) !!}
<div class=”col-sm-9″>
{!! Form::text(‘nationalCode’, null, [‘class’ => ‘form-control’, ‘required’ => ‘required’]) !!}
<small class=”text-danger”>{{ $errors->first(‘nationalCode’) }}</small>
</div>
</div>
<div class=”form-group @if($errors->first(‘password’)) has-error @endif”>
{!! Form::label(‘password’, ‘Password’, [‘class’ => ‘col-sm-3 control-label’]) !!}
<div class=”col-sm-9″>
{!! Form::password(‘password’, [‘class’ => ‘form-control’, ‘required’ => ‘required’]) !!}
<small class=”text-danger”>{{ $errors->first(‘password’) }}</small>
</div>
</div>
{!! Form::submit(‘click me’, [‘class’ => ‘btn btn-info pull-left’]) !!}
{!! Form::close() !!}

با تلاش و تمرین می توانید به راحتی از روشهای فوق در blade ها استفاده کنید و البته می تونید با اضافه کردن پکیج های blade در sublime و یا phpstorm به راحتی از دستورات فوق استفاده کنید.

مجیدآنلاین


AMIR_AKD

دانشجوی کارآفرینی علاقه مند به کسب و کار،عاشق تکنولوژی و مهندس آی تی

نوشته‌های پیوسته

آموزش

چگونه کسب وکار اينترنتی راه اندازی کنيم؟

مهم‌ترين اصل در فروش و کسب درآمد از اينترنت ايجاد راهکارهايی برای جلب‌توجه بازديدکنندگان است. اگر سايتی بسيار حرفه‌ای داشته باشيد و پايين‌ترين قيمت و بهترين کيفيت را بين رقبای خود داشته باشيد باز هم فروش نخواهيد داشت، اگر به بازاريابی اينترنتی ايمان نداشته باشيد.

آموزش

آزمایشی برای اعتبارسنجی محصول خود

با کمی بررسی در استارتاپ های ایرانی و تیم های نوپا، به این مسئله پی می بریم که مفهوم محصول کمینه پذیرفتنی (MVP) در استارتاپ ناب به درستی جا نیافتاده است. بعضی بر این باورند که محصول کمینه پذیرفتی یعنی ساخت خیلی سریع اولین نگارش از محصول ایده آل خود، آن ها تیم فنی را در یک اتاق زندانی کرده تا ۲ روزه به اصطلاح خودشان MVP استارتاپ خود را توسعه دهند.

آموزش

توسعه پلاگین برای وردپرس – اتصال به پایگاه داده

در قسمت اول مطلب “توسعه پلاگین برای وردپرس”، ساختار پلاگین‌های وردپرس رو بررسی کردیم و به کمک توابعی که توسعه دادیم، یک منو برای قسمت تنظیمات پلاگین ایجاد کردیم. هدف اصلی ما درک مفاهیمی بود خواندن ادامه...