چهارشنبه ۰۹ اسفند ۱۴۰۲

Wednesday, February 28, 2024 GMT +3:30

کار با تگ فرم (form) در HTML

html-form

تقریبا در هر سایت یا وبلاگی و به طور کل در هر صفحه وبی عناصری تعاملی وجود دارد که کاربر می تواند نسبت به آنها عکس العمل داشته باشد، به طور مثال بر روی دکمه ای کلیک کند یا از بین گزینه های مربوط به نظرسنجی یک مورد را انتخاب نماید، شکل برجسته این عناصر تعاملی فیلد ها و فرم هایی هستند که کاربران با تکمیل اطلاعات آنها و با کلیک بر روی دکمه ارسال، مقادیری را به سرور و پایگاه داده سایت یا وبلاگ مورد نظر ارسال می کنند، از آنجایی که این نوع امکانات در صفحات وب، وابسته به تگ form و عناصر زیرمجموعه آن است، لذا فراگیری دقیق این مبحث می تواند در آینده نزدیک دید شما را نسبت به تکنولوژی وب عمیق تر و چه بسا یک قدم به سمت برنامه نویسی حرفه ای نزدیک تر کند.

تگ form در html


همان طور که پیش تر گفتیم، تگ فرم با هدف ایجاد قابلیت های تعاملی (دکمه، فیلدهای متنی، امکان آپلود فایل و...) برای صفحات html تعریف شده است، در واقع کنسرسیوم جهانی وب یا w3c این نکته را مد نظر داشته که صفحات وب باید از قابلیت ارتباط دو سویه برخوردار باشند، یعنی همان طور که به فرض مدیران یک سایت می توانند مطالبی در آن منتشر کنند، کاربران نیز باید بتوانند در محتوای آن مشارکت داشته یا از قابلیت های آن به صورت سفارشی استفاده نمایند، به این ترتیب و به تدریج عناصر و ویژگی های تعاملی که شباهت های زیادی با هم داشتند در قالب یک تگ با عنوان فرم (form) و زیرمجموعه های آن معرفی شد.
یک فرم ساده به صورت زیر در html تعریف می شود.
<form>
</form>
تگ form به تنهایی کاربردی ندارد و تنها معرف ایجاد یک امکان تعاملی ار نوع فرم است، لذا این تگ را با موارد زیر تکمیل می کنیم.

خاصیت action در form


از آنجایی که اطلاعات یک فرم html پس از تکمیل شدن باید به یک فایل در سرور ارسال شود، خاصیت action برای تعیین آدرس فایل مقصد مورد استفاده قرار می گیرد، به طور مثال اطلاعات فرم زیر (در صورت ارسال) به یک فایل با نام get.php فرستاده خواهد شد.
<form action="user/comment/get.php">
</form>
مقادیر خاصیت action می تواند به صورت آدرس کامل (با //:http) یا به صورت آدرس دایرکتوری (مانند مثال بالا) در نظر گرفته شود.

خاصیت method در form


در کنار action که مقصد اطلاعات یک فرم را معیین می کند، خاصیت method شیوه ارسال را مشخص می کند، این شیوه می تواند به یکی از دو شکل post یا get (حالت پیش فرض) باشد، در متد post، اطلاعات دور از چشم ما و به صورت پنهانی، در پس زمینه به سرور ارسال می شوند اما در متد get، اطلاعات در نوار آدرس مرورگر قابل مشاهده هستند و به صورت پارامترهایی به همراه مقادیر به سرور ارسال می شوند، متد post برای ارسال مقادیر طولانی، اطلاعات حساس کاربری، آپلود فایل و... کاربرد دارد و متد get بیشتر برای ارسال اطلاعات کوتاه و با حساسیت کمتر به کار می رود.
<form action="user/comment/get.php" method="get">
</form>
نکته: متد get و post هر دو از شیوه های استاندارد HTTP برای نقل و انتقال اطلاعات هستند و در برخی زبان های برنامه نویسی مانند Ajax یا فریم ورک های مربوط به آن (مانند jQuery) ممکن است کارکردی مشابه داشته باشند، لذا تفاوت های عنوان شده در آموزش، حالت معمول و کدنویسی html را مد نظر دارد.

تگ های زیرمجموعه form


همان طور که اشاره شد، تگ form به تنهایی قابلیت خاصی در اختیار کاربران قرار نمی دهد، بلکه با کمک تگ ها و خاصیت های دیگر است که امکانات بالقوه آن قابل استفاده است، این تگ ها به طور کلی شامل input، select و textarea می شوند که در زیر کاربرد آنها توضیح داده شده است.
- تگ input: با خاصیت هایی که می پذیرد برای ایجاد دکمه های رادیویی، فیلدهای متنی (متن کوتاه)، دکمه ارسال، فیلدهای مربوط به کلمه عبور، فیلد آپلود فایل و... کاربرد دارد، تگ input باید به صورت یکتا استفاده شود.
- تگ select: تگ select در کنار تگ option قابلیت ایجاد منوهای بازشونده و انتخاب یک یا چند مورد را فراهم می کند، تگ select باید به صورت جفتی استفاده شود.
- تگ textarea: برای ایجاد فیلدهای ورود متن (متن طولانی) کاربرد دارد، تگ textarea باید به صورت جفتی استفاده شود.

تگ input در form


اصلی ترین تگی که به همراه تگ form در ایجاد قابلیت های تعاملی نقش دارد، input است که با تنظیم type های مختلف برای آن می توان انواع مختلفی از امکانات نظیر فیلد متنی (text)، فیلد کلمه عبور (password)، دکمه معمولی (button)، دکمه ارسال (submit) و ... را ایجاد کرد، در زیر چند نمونه اولیه از نحوه تعریف و به کارگیری تگ input را ملاحظه می کنید.
<form action="user/comment/get.php" method="get">
<input type="button" />
<input type="checkbox" />
<input type="hidden" />
<input type="password" />
<input type="submit" />
<input type="text" />
</form>
مقادیری که تگ input برای خاصیت type می پذیرد و کاربرد آنها به صورت خلاصه در زیر عنوان می شود.

نوع button


برای ایجاد دکمه های ساده به کار می رود، یک دکمه معمولی باید به همراه دستورات جاوا اسکریپت تکمیل شود در غیر این صورت به خودی خود کاربردی ندارد، به طور مثال:
<form action="user/comment/get.php" method="get">
<input type="button" value="دکمه" onclick="javascript:alert('دکمه در تگ فرم باید با دستورات جاوا اسکریپت تکمیل شود')" />
</form>

نوع checkbox


از این مقادیر به همراه تگ input برای ایجاد باکس های قابل تایید (چک باکس) استفاده می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="checkbox" checked="checked" name="choose" value="1" />
</form>
اگر به مثال های بالا دقت کرده باشید، هر مقادیر زیرمجموعه، می تواند تنظیمات به خصوصی نیز داشته باشد، به فرض وقتی برای چک باکس از پارامتر checked استفاده می شود، یعنی حالت پیش فرض آن را به صورت انتخاب شده تنظیم می کنیم، یا پارامتر name باعث می شود تا اطلاعات فرم پس از ارسال در سرور قابل دریافت باشد (اطلاعات هر تگ با نام آن قابل شناسایی است).
نکته: خاصیت value برای دکمه ها، صرفا حالت نمایشی دارد، اما برای سایر موارد به عنوان مقادیر پیش فرض، به سرور ارسال می شود.

نوع file


برای آپلود یک فایل به سرور استفاده می شود، به طور مثال:
<form action="user/comment/get.php" method="get" enctype="multipart/form-data">
<input type="file" name="file-name" accept="image/gif,image/jpg,application/pdf" />
</form>
برای اینکه نوع file به درستی عمل کند، باید enctype (رمزنگاری) را با مقادیر multipart/form-data به تگ form اضافه کنیم.
نکته: پارامتر اختیاری accept مشخص کننده فرمت های مجازی است که از طریق فیلد، قابل آپلود هستند، این فرمت ها بر اساس استاندارد MIME یا (Multipurpose Internet Mail Extensions) مشخص می شوند، اگرچه MIME در اصل استانداردی برای نقل و انتقال اطلاعات از طریق ایمیل در وب است، اما برای صفحات وب نیز کاربرد دارد، برای کسب اطلاعات بیشتر می توانید در لینک زیر لیست تقریبا کاملی از فرمت ها و معادل آنها در استاندارد MIME را ملاحظه کنید.
لیست فرمت ها و معادل آنها در استاندارد MIME

نوع hidden


برای ایجاد فیلدهای مخفی کاربرد دارد، مقادیر فیلدهای مخفی ثابت است و بدون تغییر کاربر به سرور ارسال می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="hidden" name="hidden-name" value="1" />
</form>
نوع hidden کاربردهای خاصی دارد، به طور مثال با تنظیم یک فیلد مخفی، می توان از ارسال شدن یک فرم اطمینان حاصل کرد یا برخی بررسی های امنیتی را با آن انجام داد.

نوع image


از نوع image برای ایجاد یک دکمه ارسال فرم (که خود از یک تصویر به عنوان پس زمینه استفاده می کند) استفاده می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="image" src="image/image.jpg" alt="submit" />
</form>
نکته: نوع image علاوه بر ارسال فرم، مختصات موقعیت خود در صفحه را نیز به سرور ارسال می کند، این مختصات به صورت دو پارامتر X و Y دریافت می شوند که هر کدام با یک مقدار عددی موقعیت افقی و عمودی تصویر را در صفحه مشخص می کنند.

نوع password


از نوع password برای ایجاد فیلدهای کلمه عبور (ستاره ای) استفاده می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="password" name="pass" maxlength="25" />
</form>
اگر در مثال بالا دقت کرده باشید، یک پارامتر دیگر نیز به فرم خود اضافه کرده ایم، این پارامتر maxlength نام دارد که از آن برای تعیین حداکثر کاراکتر مجاز یک فیلد (معمولا فیلد متنی و پسورد) استفاده می شود.
نکته: استفاده از نوع password در فرم های وب (فیلدهای کلمه عبور) از لحاظ حفظ امنیت کاربران اهمیت زیادی دارد.

نوع radio


از نوع radio برای ایجاد دکمه های رادیویی تایید شونده در فرم های وب استفاده می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="radio" name="radio-box" value="1" />
</form>

نوع reset


نوع reset برای ایجاد یک دکمه که با کلیک بر روی آن اطلاعات فیلدها به حالت پیش فرض برمی گردد کاربرد دارد، مثال:
<form action="user/comment/get.php" method="get">
<input type="reset" value="نوشتن از نو" />
</form>
نکته: استفاده از این قابلیت باید با دقت انجام شود، چرا که کلیک ناخواسته بر روی دکمه rest باعث از دست رفتن اطلاعات فعلی فیلدها می شود.

نوع submit


نوع submit برای ایجاد دکمه ارسال اطلاعات فرم کاربرد دارد، مثال:
<form action="user/comment/get.php" method="get">
<input type="submit" value="ارسال" />
</form>

نوع text


از نوع text برای ایجاد فیلدهای متنی (متن کوتاه) استفاده می شود، مثال:
<form action="user/comment/get.php" method="get">
<input type="text" name="text-feild" maxlength="255" />
</form>

تگ select در form


در صفحات html برای ایجاد یک منوی کشویی که دارای چند گزینه باشد، از تگی به نام select به همراه تگ زیرمجموعه آن یعنی option استفاده می شود، به طور مثال:
<form action="user/comment/get.php" method="get">
<select name="select-option">
<option value="0" selected="selected">انتخاب کنید</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</form>
نکته: خاصیت selected گزینه پیش فرض یک منو را مشخص می کند.
در حالت عادی هر تگ select مجاز به ارسال تنها یک مقدار است، لذا برای ارسال مقادیر چندگانه، باید خاصیت multiple را به این تگ اضافه کنیم، مثال:
<form action="user/comment/get.php" method="get">
<select name="select-option[]" multiple="multiple">
<option value="0" selected="selected">انتخاب کنید</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</form>
نکته 1: برای انتخاب چند گزینه از یک منوی select، کلید Ctrl را نگهداشته و گزینه های خود را انتخاب کنید.
نکته 2: اطلاعات فرم چندگانه به صورت یک آرایه به سرور ارسال می شود و علامت [] در انتهای نام منو بدین منظور نیاز است (درک مفهوم آرایه هدف این آموزش نیست، اما جهت آشنایی بیشتر و به زبان ساده آرایه در برنامه نویسی زبان های سمت سرور مانند php، asp و... به معنی یک متغیر است که درون خود چند متغیر دیگر دارد).

تگ textarea در form


در کنار دو تگ اصلی input و select عنصر دیگری در صفحات وب جهت ایجاد قابلیت های تعاملی نقش کلیدی دارد، این عنصر تگ textarea است که جهت ایجاد فیلدهای متنی (متن طولانی) به عنوان مثال برای وارد کردن یادداشت، ارسال مطلب، نمایش یک متن کپی رایت و... کاربرد دارد، به طور مثال:
<form action="user/comment/get.php" method="get">
<textarea name="your-text" cols="50" rows="8">
متن خود را اینجا بنویسید
</textarea>
</form>
تنظیم یک فیلد از نوع textarea به وسیله خاصیت های زیرمجموعه آن از جمله cols (ستون ها) و rows (سطرها) صورت می گیرد، از cols برای تعیین عرض و از rows برای ارتفاع استفاده می شود.
نکته 1: اندازه ها برای cols و rows صرفا جهت نمایش دلخواه فیلد کاربرد دارند و مانع ورود کاراکترهای بیشتر نمی شوند، برای محدود کردن تعداد کاراکتر مجاز از خاصیت maxlength استفاده کنید (البته محدودیت کاراکتر می تواند در سرور اعمال گردد یا در صفحات وب از تکنیک های دیگری مانند جاوا اسکریپت برای نمایش حداکثر کاراکتر مجاز به کاربر استفاده شود).
نکته 2: در حالت پیش فرض، هر فیلد متنی از نوع textarea ممکن است با اندکی تفاوت (از لحاظ ارتفاع و عرض) در مرورگرهای مختلف نمایش داده شود، برای تنظیم دقیق و یکسان اندازه باید از CSS استفاده کنیم (که خود مبحثی جدا است).

خاصیت readonly


تگ textarea برای نمایش متن های readonly (صرفا خواندنی) نیز کاربرد دارد، به طور مثال می توان با افزودن خاصیت readonly به آن، یک متن برجسته شده را جهت مطالعه کاربر به او نشان داد (کاربر قادر به تغییر متن نیست)، مثال:
<form action="user/comment/get.php" method="get">
<textarea name="your-text" cols="50" rows="8" readonly="readonly">
متن خود را اینجا بنویسید
</textarea>
</form>

خاصیت های disabled


برای غیر فعال کردن تگ های فرم (به طور کلی) از خاصیتی به نام disabled استفاده می شود، با این کار اگرچه فرم ها به ظاهر نمایش داده می شوند، اما عملا کاربر قادر به وارد کردن اطلاعات یا انتخاب موردی نیست، مثال:
<form action="user/comment/get.php" method="get">
<textarea name="your-text" cols="50" rows="8" disabled="disabled">
متن خود را اینجا بنویسید
</textarea>
</form>
نکته: خاصیت disabled محدود به تگ textarea نیست و عمومیت دارد.

استفاده از label در form


برای ایجاد برچسب های استاندارد در فرم های وب، از تگی (جفتی) به نام label استفاده می شود، label در واقع نقش معرف و برچسب را برای یک تگ فرم ایفا می کند، مثال:
<form action="user/comment/get.php" method="get">
<label for="my-text">یادداشت:</label>
<textarea name="your-text" cols="50" rows="8" id="my-text">
متن خود را اینجا بنویسید
</textarea>
</form>
همان طور که ملاحظه می کنید، label از یک id برای شناسایی فیلد مربوطه استفاده می کند، در واقع برای هر فیلدی که قصد تعریف برچسب داریم، یک id تعریف کرده و با خاصیت for برچسب را به آن نسبت می دهیم.
نکته: در کنار خاصیت های عنوان شده، برخی خواص کلی مانند class، dir، id، lang و... نیز برای تگ های فرم قابل اعمال است.
مثال و پیش نمایش آنلاین
در زیر یک مثال کاربردی از تگ form و پیش نمایش آنلاین آن را ملاحظه می کنید.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>وبگو | استفاده از فرم در صفحات وب</title>
<!-- https://webgoo.ir -->
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
    direction:rtl;
    line-height:20px;    
}
label{
    width:100px;
    height:25px;
    display:inline-block;
    vertical-align:top;
}
</style>
</head>
<body>
<form action="form-get.php" method="post">
<label for="name">نام:</label>
<input type="text" name="name" id="name" maxlength="255" />
<br />
<label for="pass">رمز:</label>
<input type="password" name="pass" id="pass" maxlength="255" />
<br />
<label for="pass">کشور:</label>
<select name="country" id="country">
<option value="" selected="selected">انتخاب کنید</option>
<option value="Iran">ایران</option>
<option value="Japan">ژاپن</option>
<option value="Afghanistan">افغانستان</option>
<option value="Germany">آلمان</option>
<option value="Australia">استرالیا</option>
</select>
<br />
<label for="text">یادداشت:</label>
<textarea name="text" id="text" cols="30" rows="6">
</textarea>
<br />
<input type="submit" value="ارسال" />
</form>
<hr />
اطلاعات فرم بالا پس از ارسال (متد post)، به فایلی با نام فرضی form-get.php فرستاده شده و پردازش می شود.
</body>
</html>
پیش نمایش
دسته بندی: آموزش مقدماتی » HTML
related مطالب بیشتر:
تگ های اصلی و کلیدی HTML
متاتگ ها (Meta Tags) و کاربرد آنها در صفحات وب (HTML)
آشنایی با HTML، زبان پایه کدنویسی وب
فرمت بندی و کار با متن و پاراگراف در HTML
نحوه ایجاد لینک در HTML
دیدگاه
more ۱۲۸ دیدگاه برای این مطلب ارسال شده است.
more دیدگاه جدید بر اساس تاریخ ارسال در انتهای دیدگاه های موجود نمایش داده می شود.
mohamad
۱۳:۵۱ ۱۳۹۸/۰۸/۱۰
سلام و خسته نباشید ،
توی فرمی که ساختم چند تا drop down دارم که میخوام با php براشون شرط بذارم به طوری که وقتی گزینه 1 از لیست اول انتخاب شد در لیست بعدی تعدادی آیتم که دارای value یکسان هستند نمایش داده بشن
ممنون میشم کمکم کنید
لطفا سوال را با جزئیات بیشتر و ترجیحا نمونه کد مطرح کنید، مشخص نکرده اید دقیقا در کدام مرحله مشکل دارید؟
برای بررسی موارد انتخابی و ایجاد لیست بعدی، فرم باید به صورت معمول یا مقادیر فیلدها با Ajax ارسال و با جاوا اسکریپت خروجی سمت کاربر مدیریت شود، در غیر اینصورت اگر صرفا انجام بررسی ها بدون ارسال فرم و در لحظه مد نظر است باید صرفا از جاوا اسکریپت استفاده شود.
در صورت نیاز نمونه کدها را به آدرس ایمیل ما (موجود در بخش تماس) ارسال کنید.
mohammad
۲۱:۵۵ ۱۳۹۹/۰۲/۱۲
آموزشتون خیلی فهما و دقیق بود
ممنون
amir mtf
۱۲:۳۷ ۱۳۹۹/۰۲/۱۵
سلام ببخشید من میخواستم در تگ این‌پوت برخی از کلمات و علامت ها رو حذف کنم.
یک درخواست دیگر هم دارم اگه میشه کد یک سایت action.html هم بهم بدهید
چه علامت هایی را می خواهید حذف کنید؟ هنگام تایپ یا اینکه فیلد کامل شده باشد؟
منظورتان از "کد یک سایت action.html" مشخص نیست؟ اگر منظور فایل PHP است لطفا به آموزش های مقدماتی PHP مبحث متد GET و POST مراجعه کنید، با توجه به هدف برنامه کدنویسی آن هم متفاوت خواهد بود، در کل باید با برنامه نویسی آشنا باشید.
فرزانه
۱۱:۴۵ ۱۳۹۹/۰۳/۱۱
سلام
تو بررسی کدهای نوشته شده برای یک وبسایت در قسمت login برای یوزر و پسورد نوشته شده form-control-feedback و form-control من از کجا بفهمم این فرم کنترلی چی هست و مثلا چه فیلتری روی input صورت میگیره و کلمات کلیدی و فرضا سیمی کالن و ... مجاز به ورود توسط کاربر نیستن.
منظورم اینه کجا باید بهش اشاره بشه. من کار طراحی سایت نکردم و دانشجو هستم، برای حل یک تمرین نیاز به دونستن این موضوع دارم.
تمام کدهای صفحه چندین سایت رو خط به خط بررسی کردم از چند نفر پرسیدم نمیدونستن. اگر درست متوجه شده باشم لاگین اکثر سایتا چون فیلتر خاصی نمیذارن، اگر در قسمت سرور چک نشه در معرض هک هست... مگر اینکه جایی بهش اشاره بشه که من ندونم
از لطفتون پیشاپیش سپاسگذارم.
با توجه به توضیحات و پارامترهای درج شده به نظر سایت بر مبنای موتور قالب Bootstrap نوشته شده و احتمالا کدنویسی سمت سرور آن نیز بر مبنای MVC (Model, View, Controller) است، هدف از این ساختار جدا کردن بخش های اصلی یک برنامه (ماژول ها، قالب و بخش ظاهری، کنترل کننده ها) از هم جهت نظم بهتر و توسعه پذیری ساده تر است، لذا برای پی بردن به اینکه چه اعتبارسنجی روی فیلدهای فرم انجام می شود باید رد ارسال اطلاعات را بگیرید، یعنی ببینید اطلاعات در قسمت action فرم به چه آدرسی ارسال می شوند، سپس کدنویسی آن فایل در سرور را بررسی کنید، معمولا فرم ها از دو متد GET یا POST برای ارسال اطلاعات استفاده می کنند و در سرور نیز این دو متد برای دریافت کاربرد دارند، ببینید در برنامه به چه نحوی اطلاعات دریافت شده است، سپس اطلاعات دریافت شده در چه تابعی به عنوان آرگیومنت یا به چه نحوی استفاده شده اند، احتمالا در این تابع می توانید تنظیمات اصلی را که برای کنترل فیلدها استفاده می شود مشاهده کنید، البته کار به این سادگی هم نیست و باید مهارت برنامه نویسی و کدخوانی سمت سرور مرتبط با زبان مربوطه (به فرض PHP) داشته باشید، در صورت تمایل می توانید کل برنامه را به آدرس ایمیل ما (موجود در بخش تماس) ارسال کنید تا در فرصت مقتضی بررسی گردد.
مجید
۰۳:۴۳ ۱۴۰۰/۰۸/۰۲
سلام وقت بخیر
ببخشید من تو صفحه ادمین میخواستم یه اینپوت برای تگ های سئو بسازم که هر کلمه جدا جدا توش ثبت بشه چیکار باید بکنم؟
سوالتان پاسخ کوتاهی ندارد! باید چند مرحله کار انجام شود که شامل کدنویسی HTML برای طراحی فرم و فیلد input ورود کلمات است، سپس این فرم باید به یک فایل PHP در سرور ارسال شود و در این فایل با برنامه نویسی PHP مقادیر را از فرم HTML دریافت و در نهایت با اجرای دستورات اتصال به پایگاه داده MySQL اطلاعات دریافت شده را در دیتابیس ذخیره کنیم، قاعدتا هر کدام از این مراحل نیاز به آموزش جداگانه دارند که در صورت عدم آشنایی قبلی باید از سطح مقدماتی PHP و MySQL شروع کنید.
مجید
۱۴:۰۲ ۱۴۰۰/۰۸/۰۲
نه من منظورم اینه که اینپوتو باید چیکار کنم که توش بشه تگ سئو نوشت که بغلشم ضربدر میاد هر کلمه جدا جداس
برای جداسازی کلمات به شکل مد نظرتان صرف استفاده از تگ های HTML کافی نیست، باید از JavaScript و CSS مشابه نمونه کد زیر استفاده کنید (در این نمونه از jQuery استفاده شده):
https://stackoverflow.com/questions/14083272/input-field-for-tags-separated-by-comma
نکته: کدهای JavaScript را درون تگ script و کدهای CSS را درون تگ style استفاده کنید (در نمونه کد تگ های script و style درج نشده اند!).
پـــرتو
۱۶:۱۵ ۱۴۰۰/۱۱/۳۰
سلام خسته نباشید شرمنده مزاحم میشم روم نمیشه سوال بپرسم بخدا سوالاتم زیاد شد شرمنده بخدا یه سوال دیگه داشتم بازم تورو خدا ببخشید وقتتان هم انگاری گرفتم ، شرمنده ولی سوالم این هستش که یادتونه یه کد بهم داده بودین که برای بردر پست و اینا که عنوان هم پس زمینه داشت؟ ببخشید من می خاستم برای این قالبمم هم همین طور باشه ولی نمی دونم دقیقا کجا باید کد رو بزارم ، متاسفانه کد رو هم نمیتونم بفرستم متاسفانه ولی می تونم همون کدی رو خودتون برام ساختین برای بردر و اینا بفرستم ولی کد قالب رو نمی تونم شرمنده ، برای این قالبمم هم باید همین کد رو بزارم؟ و اگه آره باید حدودا کجا بزارم می دونم بدون دیدن کد نمی تونید بگید ولی لطفا حدودشو بگید متشکرم
قبلا گفتیم اگر کمی با HTML و CSS آشنا باشید جواب خیلی از سوالتتان را به راحتی پیدا می کنید و در این شرایط بهتر می توانیم کمکتان کنیم، HTML و CSS خیلی سخت نیستند و در زمان کم آشنایی خوبی پیدا می کنید، در هر صورت کد قبلی مربوط به قالب قبلی است و استایل آن با توجه به تگ های HTML و Class و ID این تگ ها تعریف شده است، برای قالب جدید باید متناسب با کلاس و ID تگ ها استایل جدید تعریف کنید.
سجاد
۱۹:۵۰ ۱۴۰۲/۱۱/۰۳
با سلام و خسته نباشید
من برای جستجو از این فرم استفاده می کنم
<?php echo CHtml::beginForm(); ?>
جستجوی مطلب <?php echo "<span style='margin-right:15px'>" .CHtml::dropDownList('field',isset($_POST['field'])?$_POST['field']:null,array(
'id'=>' شناسه مطلب ',
'title'=>' عنوان ',
'content'=>' محتوا ',
)),

CHtml::dropDownList('type',@$_POST['type'],array(
'1'=>' بخش مطالب ',
'2'=>' بخش اخبار ',
)) ,

جستجوی خبر <?php echo "<span style='margin-right:15px'>" .CHtml::dropDownList('field',isset($_POST['field'])?$_POST['field']:null,array(
'id'=>' شناسه خبر ',
'title'=>' عنوان خبر ',
'content'=>' محتوای خبر ',
)),

CHtml::textField('str',isset($_POST['str'])?$_POST['str']:null,array('dir'=>'auto','size'=>25)),
CHtml::submitButton('جستجو' , array('class'=>'submit')),
CHtml::endForm(); ?>

<?php echo CHtml::endForm(); ?>
میخوام وقتی بخش
$_POST['type']
رو انتخاب می کنم گزینه های جستجو بر اساس جستجوی خبر و جستجوی مطلب نشان داده بشه
با تشکر
توضیحات شما برای درک اینکه می خواهید دقیقا فرم به چه صورتی باشد کافی نیست، لطفا حداقل با چند تصویر یا نمونه آنلاین منظورتان را توضیح دهید، همچنین ظاهرا کد شما مربوط به فریم ورک Yii است؟، متاسفانه امکان تست کد شما به صورت واقعی و قابل اجرا در مرورگر فراهم نیست و بدون تست هم نمی توانیم راه حل خاصی ارائه کنیم.
more لطفا پیش از ارسال دیدگاه نکات زیر را مد نظر داشته باشید:
- به سوالات کلی، زمانبر، مبهم و مشکلاتی که تلاشی برای رفع آنها نکرده باشید پاسخ مختصر داده شده یا به بخش برنامه نویسی اختصاصی ارجاع داده می شوند.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین یا به صورت حساب موقت و آزمایشی قرار دهید تا امکان بررسی دقیق مشکل و خطایابی میسر باشد.
- تمام دیدگاه های ارسالی خوانده شده و برای هر کاربر مدت زمان لازم جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.



 refresh
10 × 10
4 × 6
20 × 20
=
آخرین دیدگاه ها
more برای دسترسی سریع به یادداشت مربوطه می توانید از لینک مطلب در کادر زیر استفاده کنید.
پـــرتو
سلام خوبید؟ ببخشید مزاحم میشم یه سوال کامپیوتری داشتم اونم اینکه این خطای dll یعنی چی و چطوری رفع میشه ؟ بیشتر توی نرم افزارها...
۱۴۰۲/۱۲/۰۵

سعید
با تشکر از شما دوست عزیز درست شد. دست شما درد نکنه یه سوال دیگه هم دارم چطور میشه توی استایل تصاویر رو فیت...
۱۴۰۲/۱۲/۰۳

سعید
با تشکر از شما درست شد فقط یه مشکلی دارم میخوام شناسه اون مطلب رو اینطوری براش فراخوانی کنم ولی شناسه رو دریافت...
۱۴۰۲/۱۲/۰۲

سعید
با تشکر از شما خیلی خوب بود. فقط یه مشکلی داره، اگه لینک دانلود داخل عکس باشه کار نمی کنه و بازم لینک رو...
۱۴۰۲/۱۲/۰۲

سعید
با سلام و خسته نباشید من یه تابع با php میخوام که لینک های موجود در یک متن رو برام شناسایی کنه بعد به...
۱۴۰۲/۱۲/۰۱

روح اله
سلام چرا وبلاگ من در نتایج یاهو میاید ولی در نتایج گوگل نمیاید؟
۱۴۰۲/۱۱/۲۶

جواد
سلام خسته نباشید. من میخواستم تعداد نامحدودی عدد رو با هم جمع و تفریق کنم از کدوم حلقه باید در public function کلاسم استفاذه...
۱۴۰۲/۱۱/۲۵

محمد
سلام من گوشی نوکیای جاوا دارم که ساعت گویاش فعال شده و به صورت انگلیسی ساعت رو میگه میخواستم ببینم چطور میشه ساعت گویاش...
۱۴۰۲/۱۱/۲۳

پـــرتو
سلام خوبید؟ ممنون از راهنماییتون من ادرس وبلاگ رو براتون ایمیل کردم واقعا ممنونم مچکرم مرسی
۱۴۰۲/۱۱/۱۸

پـــرتو
سلام خسته نباشید ببخشید مزاحم میشم سوال قبلیم رو یادتونه که گفته بودم یه کد بدین که بشه عکس های داخل پست رو فیکس کنه...
۱۴۰۲/۱۱/۱۵

فاطمه
سلام وقت بخیر وب بازدید کننده داره ولی گویا آدرس وب برای برخی از افراد باز نمیشه چه کاری میتونم انجام بدم تا...
۱۴۰۲/۱۱/۰۹

سیاوش آهی
سلام وقت بخیر استاد، من در سایتم ویدیوهای اموزشی دارم و میخوام با دستورات htaccess امکان دانلود آن را غیرفعال کنم ولی در مرورگر (سایت)...
۱۴۰۲/۱۱/۰۷

پـــرتو
خب الان این تگ رو کجا بزارم؟ و تاثیر سراسری یعنی چی؟؟ در مورد هارد هم منظورتون از چندنمونه فایل در دسترس باشد یعنی چی؟؟؟...
۱۴۰۲/۱۱/۰۵

سجاد
با سلام و خسته نباشید من برای جستجو از این فرم استفاده می کنم رو انتخاب می کنم گزینه های جستجو بر...
۱۴۰۲/۱۱/۰۳

پـــرتو
سلام خسته نباشید ببخشید مزاحم میشم می خواستم یه سوال بپرسم اونم اینکه من یه مشکلی کدم داره اینکه عکس وقتی داخل پست می گذارم...
۱۴۰۲/۱۰/۲۸

مریم
سلام. من از قالب های سایت پیچک که استفاده میکنم مطالب رو نشون نمیده و به جاش مینویسه archive title. اما از قالب های پیش...
۱۴۰۲/۱۰/۲۶

بهاره هوشمندی
توی اکشن callback فقط کوئری ها هستند و من دستور die رو جای مناسب گذاشتم چون جای دیگه نمیشه گذاشت! این کوئری ها هستند که...
۱۴۰۲/۱۰/۲۳

بهاره هوشمندی
با تشکر از شما استاد بزرگوار اینو تست کردم لینک رو به درستی شناسایی نمی کنه و ارور میده! وگرنه همون مسیر خودش رو...
۱۴۰۲/۱۰/۲۳

بهاره هوشمندی
با سلام استاد با sleep نمیشه متن به کاربر نشون داد فقط میشه تاخیر ایجاد کرد واسه همین die بهتره ولی من نمی دونم...
۱۴۰۲/۱۰/۲۳

بهاره هوشمندی
با سلام و خسته نباشید واسه ترجمه از این تابع استفاده میکنم
۱۴۰۲/۱۰/۲۲

بهاره هوشمندی
با سلام متاسفانه هرکاری کردم نشد! یه هفته ست درگیرش هستم انگار هیچ راهی نداره البته احتمالا به دستور die باشه ولی اون...
۱۴۰۲/۱۰/۲۱

بهاره هوشمندی
با سلام و خسته نباشید وقتی میخوام با گوگل ترانسلیت متنی رو با php ترجمه کنم عکس ها رو خراب می کنه چون توی...
۱۴۰۲/۱۰/۲۱

بهاره هوشمندی
من تونستم یه جوری کدها رو توی قالب بذارم ولی چون کال بک اصلا فایل ویو نداره و یک چک کنه است هیچ جوری پیام...
۱۴۰۲/۱۰/۱۹

بهاره هوشمندی
با تشکر از شما من فقط اکشنش رو دارم که اکشن به تنهایی کار نمی کنه! :( الان این کد رو توی قالب...
۱۴۰۲/۱۰/۱۹

بهاره هوشمندی
با سلام و با تشکر از شما استاد خیلی خوب بود من توی فریمورک yii صفحه callback ندارم کاربر زمان زیادی برای اکشن...
۱۴۰۲/۱۰/۱۸

بهاره هوشمندی
با سلام لینک رو نگاه کردم خوب بود ولی من میخوام برای کاربر بنویسم که تا ۱۰ ثانیه صبر کنه که کاربر صفحه رو...
۱۴۰۲/۱۰/۱۸

بهاره هوشمندی
با سلام و خسته نباشید استاد لود کردن کوئری های سایت من واسه یه صفحه زیاده و ۱۰ تا ۱۵ ثانیه طول میکشه که...
۱۴۰۲/۱۰/۱۷

سجاد مهدوی
با سلام ببخشید می تونید توی سایت نوبیتکس ثبت نام کنید و با api هایی که دادن یه کد بنویسید که اعلام موجودی رو...
۱۴۰۲/۱۰/۱۰
  در انتظار بررسی: ۱
 پاسخگویی به سوالات ممکن است تا ۲۴ ساعت زمان ببرد.