اطلاع رسانی به کاربر

[night star]

سلام من یک فرم دارم می خوام بعد از فشردن submit یک علامت یا تیک کنار submit بخوره که به کاربر نشون بده این دکمه قبلا فشار داده شده البته من خودم این کدو دارم مشکل من اینجاست این کد در صورتی کار می کنه که فرم انتقال داده بشه به یه صفحه دیگه یعنی target مساوی با blank باشه در صورتی که من همچین چیزی نمی خوام و می خوام در همین صفحه جاری به محض فشردن یک کلید یه عکس یا علامت کنارش بیاد این هم کدی که من دارم : button type ="submit" onClick="this.innerHTML='Submit <img src=img.gif\>';" >Submit

 

[Cybertoos]

خدا قوت
این تابع جاوااسکریپت مورد نیاز:

[LEFT]<script language="javascript">
function showImage(){
    document.getElementById('image').innerHTML = '<img src=image.png" alt="" title="" width="100" height="100">';
}
</script>
[/LEFT]

این هم طریقه استفاده:

[LEFT]<form id="form1" name="form1" method="post" action="" onsubmit="javascript:return false;">
   <p>
    <input type="submit" name="button" id="button" value="Submit" onclick="javascript:showImage();return false;" />
    <div id="image"></div>
  </p>
</form>
[/LEFT]

این یک روش موقته( چون جلوی ارسال فرم رو می گیره).به خاطر اینکه من از مرحله بعد کارتون خبر ندارم سریع یه چیزی نوشتم.
اگر منظور شما رو درست متوجه شده باشم باید این کارتون رو راه بندازه.در غیر این صورت بیشتر توضیح بدین شاید تونستیم کمکی کرده باشیم.

 

[night star]

با تشکر فراوان به خاط کد خوبتون فقط یه مشکل اینکه چطور می شه کاری کرد که عکسی که بعد از فشردن دکمه میاد کنار دکمه بیاد یعنی با دکمه تو یه خط باشن

 

[Cybertoos]

خدا قوت
البته برای چیدمان المنت های HTML در داخل صفحه روشهای زیادی وجود داره به عنوان مثال شما می تونید از خاصیت float در css استفاده کنید که باز همین هم بسته به استفاده شما از HTML یا XHTML در برخی نسخ خروجی متفاوتی داره ببنین این کارتون رو راه میندازه:

[LEFT]<div style="float:left;"><input type="submit" name="button" id="button" value="Submit" onclick="javascript:showImage();return false;" /></div><div id="image">
    </div>
[/LEFT]

 

[night star]

با عرض پوزش مجدد من یه فرم دارم که داخلش یه سری اطلاعات به کاربر نشون میده و کنار هر کدوم از این اطلاعات یک دکمه submit داره که با انتخاب این دکمه اطلاعات انتخابی وارد بانک می شه.حالا این کدی که شما به من دادید فقط وقتی روی اولین submit کلیک کنی عکس میاره من می خوام واسه همه submit ها عکسو بیاره

 

[MDP]

و خداوند Jquery را خلق کرد :

<div style="float:left;">
<input type="submit" name="button" id="button" value="Submit" onclick="javascript:showImage();return false;" />
</div>
<div class="image">
</div>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
 $("input[type=submit]").click(function(){
  var target = $(this).next("div.image");
  target.html('<img src=image.png" alt="loading..." title="loading..." width="100" height="100">');
 };
});
</script>

این کد به صورت اتماتیک تمام input هایی که خاصیت type اونا submit هست رو پیدا می کنه و بعد از کلیک روشون توی المنت div که دقیقا بعد از اون باشه و کلاس Css ای به نام image داشته باشه اون عکس رو می زاره...

فقط توی هدر باید کتاب خونه jquery اضافه بشه !

 

[Cybertoos]

خدا قوت
MDP عزیز لازم دونستم چند نکته رو اضافه کنم پس رخصت(با اجازه سابق):
1- night star عزیز در شروع بحث اشاره ای به Multipart بودن فرمشون نکردن من هم یک راه حل عاقلانه (منظورم سبک و سریعه)پیشنهاد کردم (البته با اجازه اساتید) و گفتم پیشنهاد JQuery صرفه اقتصادی!!!(از نظر زمان Load شدن صفحه و مصرف پهنای باند) نداره.
2- night star عزیز مشخص بود تا اندازه ای به جاوااسکریپت واردن اما من بهتر دیدم یک کد Reusable بهشون پیشنهاد کنم با اندک جزئیات که مد نظر قرار نگرفته بود.
3- اکیدا پیشنهاد می کنم در مورد توصیه به استفاده از بسته کد های سنگینی مثل JQuery بدون ذکر موارد ذیل خودداری کنیم:

1) موجه شدن صرفه اقتصادی استفاده (استعمال!!!) یعنی مثلا در صفحه ای چندین عملیات جاوااسکریپتی مثل منوی درختی , منوی دراپ داون , Form Validation (اعتبار سنجی فرم) و ... (یک یا چند مورد) وجود داشته باشد.
2)معرفی هسته JQuery به تنهایی به کسی که به طور کامل با زبان جاوااسکریپت آشنایی دارد و در غیر این صورت معرفی یک پلاگین سبک برای دریافت خروجی حداقلی(کارایی مورد انتظار).
3)و مهمترین مساله معرفی و تشویق به استفاده از توزیع Minified (کم حجم شده) و gzip (فشرده شده) و تکنیک های استفاده بهینه در صفحه.

به نظر من اگر یکی از موارد بالا تحقق پیدا نکنه به نظر من (نظر شخصی!!!) باید یک کد سبک فی البداهه (البته کارا و بدون اشکال) بنویسم و یا در صورت وجود بسته آماده اختصاصی که در سایتهایی مثل Dynamicdrive پیدا میشن اون رو معرفی کنم.

این بود انشای من.
-----------
حالا MDP عزیز می خوام هم از نظر نگارشی و هم از نظر علمی به من نمره بدین.
فقط یه چیزی توی خیلی از فروم ها کل کل می کنن آخرشم به هیچ جایی نمی رسن امیدوارم این بحث علمی از مسیرش خارج نشه.
راستی یادم رفت بگم من خودم عاشق JQuery هستم.و برای آموزش JQuery یه فکرایی توی سرم هست... .

 

[night star]

mdp و cybertoos عزیز لطفا زیر سیکلم حرف بزنید تا من هم متوجه شم

 

[Cybertoos]

خدا قوت
این هم از اثرات پیچیده کردن بحث:

mdp و cybertoos عزیز لطفا زیر سیکلم حرف بزنید تا من هم متوجه شم

من هم با JQuery آشنا بودم ولی صلاح ندیدم زیاد بحث رو پیچش بدم.
night star عزیز من واقعا از شما عذر میخوام.
بهتره شما فرمتو برام بفرستی تا خودم درستش کنم و بهمراه توضیحات(آموزش جاوااسکریپت) -حتما و حتما توضیح بخواین- براتون بذارم.

 

[MDP]

اووووه چرا میزنی رفیق.من فقط جواب رو دادم که کار بنده خدا راه بیوفته.

این بنده خدا فقط جواب سوالش رو می خواد دنبال یاد گرفتن نیستن.( اینو تجربه کاریه این چند وقته میگه )

بعدشم یادگیری Jquery نیازی به دانش تخصصی قبلی از js نداره.اینو خود سایتش میگه.

به هر حال اینم میشه به یه پلاگین reusable تبدیل بشه ولی کارایی نداره.

من همیشه برای خودم توی کار هام یه فریم ورک بر پاییه Jquery طراحی می کنم که توی هر پروژه هم عوض میشه ولی کارایی ثابته.

این دوست ما هم باید یکم تلاش کنه.

 

[k2-4u]

سلام دوستان
به نظرم Jquery یکمی برای این کار سنگینه

 

[night star]

این بنده خدا فقط جواب سوالش رو می خواد دنبال یاد گرفتن نیستن.( اینو تجربه کاریه این چند وقته میگه )

mdp عزیز من می خوام jquery یاد بگیرم ولی الان وقتشو ندارم به هر حال ممنون از راهنمایی تون اگه براتون امکان داره یه منبع بهم معرفی کنید تا بنا به توصیه شما من شروع به آموختن کنم .

و cybertoos عزیز فرض کنید این برنامه منه چون کدهای برنامه ام زیاده یک فرم شبیه برنامه ام رو براتون میزارم

<form action="" method="post">
  <input type="text" name="textfield" />
  <input type="submit" name="Submit" value="Submit" />
 </form>
<form action="" method="post">
  <input type="text" name="textfield2" />
  <input type="submit" name="Submit2" value="Submit" />
</form>

 

[Arash_Niazmand]

دوستان خسته نباشید .

خواستم بگم بجای این همه سختی و رنگارنگی کد های مختلف فکر نمیکنید استفاده از ajax راهی مناسب و
با امکانات دلخواه و استوار باشه .

البته نظر شخصیم بود . از بحث شما هم بسیار لذت بردم .

 

[MDP]

سوال رو دوباره بخون رفیق !