תג ארכיון: jQuery

XSLT ו- Mootools דוגם

אני עשו המון XSLT jQuery והמחשבה שניתן לשתף מקטעי כמה אחרים ייתכן שיהיו שימושיות עבורך בעתיד.

דוגמה 1: לפלוט JavaScript פשוט / jQuery ב- XSLT:

<xsl:התאמת תבנית = "משהו" xml:שטח = "לשמר">

  <!– ריק החוצה השדה המוסתר של מסננים ידידותי שאילתה –>
  <סקריפט סוג = "טקסט/javascript">
    $(המסמך).מוכן(פונקציה(){
      $("#QueryFriendlyFilters").ול("ריק");
    });
  </קובץ script>

</xsl:תבנית>

מעט מקרינה JavaScript תמתין הטעינה של הדף (בגלל $(המסמך).מוכן(…)) ולאחר מכן ערכות הערך של שדה מוסתר בשם QueryFriendlyFilters הערך הליטרלי "ריק".

דוגמה 2: השימוש <xsl:אם> כדי לבדוק "גדול מ",  "פחות", ועוד.

<xsl:התאמת תבנית = "משהו" xml:שטח = "לשמר">

  <div id = "fdcAllFilters">
 
    <xsl:אם test="@Count>0">
      <span class = "fdcFilterLabel">המסננים הנוכחיים:</טווח>
    </xsl:אם>

    <!– חומר נוסף קורה כאן. –>

</xsl:תבנית>

גזיר לעיל יבדוק אם תכונה בשם "לספור" יסוד "משהו" גדול מאפס.  ה-XML מאחורי זה יהיה משהו כמו:”

<משהו Count = "5" />

דוגמה 3: סוב בין כל הרכיבים, interspersing שיחות jQuery.

<!– סוב בין כל המסננים ולהציג הנכון  קישורים. –>
<xsl:עבור-כל בחירה = "UserFilter">

  <מחלקה = "FilterHref" href = "javascript:mySubmitPage('RemoveUserFilter','{@ ID}’)">[X]</של>

  <span class = "fdcFilterLabel"><xsl:הערך של select="@FilterValue"/></טווח>

  <סקריפט סוג = "טקסט/javascript">

    $(המסמך).מוכן(פונקציה(){
        <xsl:טקסט><![CDATA[$("#QueryFriendlyFilters").ול( ($("#QueryFriendlyFilters").ול() + " ]]></xsl:טקסט>\"<xsl:הערך של select="@FilterValue"/>\"<xsl:טקסט><![CDATA["));]]></xsl:טקסט>
    });

  </קובץ script>

</xsl:עבור-כל>

גזיר לעיל הוא מורכב ביותר, ייתכן שקיימות דרכים קל יותר לעשות זאת.

ה-XML מאחורי זה נראה בערך כך:

<UserFilter ID = FilterValue "123" = "xyzzy" />

מקטע זה איטראציה עד <UserFilter> צמתים. 

הוא מפיק תחילה עוגן תיוג אשר בעת לחיצה על הפעלת פונקציה JavaScript כבר בדף, "mySubmitPage" ומעביר את הערך של תכונה ב- <UserFilter> צומת בשם "מזהה". 

לאחר מכן, הוא מפיק מסוימים jQuery אשר ממתין לטעינת העמוד.  כי jQuery מעדכנת שדה מוסתר בשם "QueryFriendlyFilters" על-ידי הוספת הערך של תכונת FilterValue.  הערה כל מטורף <xsl:טקסט> ו <![CDATA[ … ]]> דברים.

זהו זה, התקווה שהיא מסייעת!

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

Lists.asmx, GetListItems ותיקיות

אני עושה קצת מחקר עבור מישהו היום סביב שירות האינטרנט list.asmx במסגרת של SharePoint 2010 (וגירסאות קודמות).  היא הצליחה לקבל את רשימת הפריטים בתיקיית הבסיס (כולל שמות תיקיות המשנה), אך לא היתה אפשרות לקבל פריטים בתוך תיקיות המשנה.  אני עשיתי את חלקם מביטים למצות והיא שאלה נפוצה באופן מפתיע.  עדיין, ושאני לא יכול לקבל תשובה טובה לשאלה פשוטה, "אם אני מכיר את התיקיה, כיצד ניתן לקבל את הפריטים בתיקיה?”  והאמת, אני לא מנסה כל מה קשה מאז כבר רציתי דמות זו אחת החוצה בכוחות עצמי קצת חיוך.

לשם ביצוע פעולה זו, יצרתי באתר בשם "תרחישים בלוגים" ואת רשימה מותאמת אישית בשם "רשימה עם תת תיקיות מותאמות אישית".  מכן יצרת תיקיות בשם:

  • השנה 2005
  • השנה 2006
  • השנה 2007

הוספתי מספר פריטים לתיקיה "השנה-2006".  דבר זה נראה:

image

החבר שלי לכתוב קוד C # אבל במקום שימוש ב- Java, מעטפת ה-SOAP היה מה היא באמת צריך.  כדי לקבל את זה, אני כתב מעט jQuery, ואז השתמש כנר כדי לקבל את השיחה בפועל של HTTP.

הנה jQuery רלוונטיים (העתקתי את הקוד למטה מתחת אם ברצונך לבצע העתקה/הדבקה):

image

הם המפתח הראשון היא לכלול שני <queryOptions> ו <QueryOptions> צומת.  המפתח השני הוא כי <תיקיה> צומת הוא URL שאליה ללקוח יש גישה.

ייתכן שקיימות דרכים אחרות להשיג את זה, אבל זה עבד טוב עבורי בעת שימוש ב- jQuery.

הנה מעטפת ה-SOAP עבור לעיל:

<soapenv:Xmlns מעטפה:soapenv =’http://schemas.xmlsoap.org/soap/envelope/’>                
  <soapenv:הגוף>
    <GetListItems xmlns =’
http://schemas.microsoft.com/sharepoint/soap/’>
      <listName>רשימה מותאמת אישית עם תיקיות המשנה</listName>
      <viewFields>  
        <ViewFields>
          <שם FieldRef =' כותרת’ />
          <שם FieldRef ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <תיקיה>
http://demoserver1/בלוגים תרחישים/רשימות/מותאם אישית ברשימה עם תת תיקיות/שנה 2006</תיקיה>
        </QueryOptions>
      </queryOptions>
   
</GetListItems>
  </soapenv:הגוף>
</soapenv:מעטפה>

המון דוגמאות ודיון סביב זה הוביל אותי להאמין כי כל מה שדרוש לי היה <QueryOptions> וציין שם תיקיה.  בשבילי, אני זקוק לשני להקיף אותו בתוך <queryOptions> וכן לציין כתובת URL מלא <תיקיה> צומת.

הנה תוכנית ההתקנה של AJAX jQuery:

$(המסמך).מוכן(פונקציה() {
       var soapEnv =
           "<soapenv:Xmlns מעטפה:soapenv =’http://schemas.xmlsoap.org/soap/envelope/’> \
               <soapenv:הגוף> \
                    <GetListItems xmlns =’http://schemas.microsoft.com/sharepoint/soap/’> \
                       <listName>רשימה מותאמת אישית עם תיקיות המשנה</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <שם FieldRef =' כותרת’ /> \
                              <שם FieldRef ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <תיקיה>http://demoserver1/Blogging תרחישים/רשימות/מותאם אישית ברשימה עם תת תיקיות/שנה 2006</תיקיה> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:הגוף> \
           </soapenv:מעטפה>";

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

קינון אינסופית <div> תגיות ו- Mootools

זה נראה כמו נושא כלי יוצא דופן, אני לא בטוח שזה באמת שווה בלוגים אודות, אבל זה מעולם לא הפסיקה אותי לפני, אז הנה אנחנו הולכים חיוך

אני עובד על פרוייקט בו אני אני שליפת נתונים מסוימות לאחר חיפוש, אריזה זה לתוך הודעת ה-XML ולאחר מכן ב- XML הוא בסופו של דבר הופך HTML באמצעות ה-XSLT.  יש הרבה jQuery מעורב, סיבית אחת אשר מיישמת חלק מהפונקציונליות הטאבים.  בעת לחיצה על לשונית (באמת, של <div>), jQuery מפעיל להחביא() הראי() ב- divs שונים (עומס הדף ההתחלתי מוריד את התוכן כך ישנן פעולות postback אין במקרה זה).

חבורה של לפני שעות, הכרטיסיה מיתוג לוגיקה התחיל לשיבושים, זה מופיע באחת הכרטיסיות שלי.  אני בסופו של דבר הצליחו לקשר זאת העובדה שבה internet explorer (לפחות) חשב <div> תגים מקוננים רחוק, עמוק הרבה יותר המיועד.הכלים מפתח יראה:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div>  <— סוף סוף להראות את זה נסגר כל הדרך לכאן!

כל כך, אם כן $("#Tab1Content").הסתר(), אני גם הייתי מסתיר Tab2 ואני לעולם לא אראה Tab2 אם אני גם לא להראות Tab1.  העתקתי והדבקתי את הקוד לתוך visual studio וזה הראה כל בתור של div יפה, בדיוק כמו שהם היו אמורים לעשות, כשאני נראה ככה:

-<div id = "Tab1Content">
  +<div>
  +<div>
-<div id = "Tab2Content">
  +<div>
  +<div>

לנצח את הראש שלי בקיר לזמן והבחנתי כי בקוד ה-HTML בפועל קוד היה יצירת הרבה ריק <div> תגים, כמו:

<הגוף>

  <div id = "Tab1Content">

    <div id = "row1" />
    <div id = "row2" />

  </div>

  <div id = "Tab2Content">

    <div id = "row1" />
    <div id = "row2" />

  </div>

</הגוף>

(האמור לעיל הוא waaaaaaaaaaaay פשטני.  תגי div ריק תקפים לחלוטין. חלק שלי <div> תגיות היו מלאות תוכן, אבל לא היו הרבה יותר.  אני נשבע לך. זה שלי <xsl:עבור-כל> הוראות פלטו הקצר-הטופס div תגיות כאשר ה-xsl:לא עבור יח ' למצוא את כל הנתונים.  אני הכרחתי את הערת HTML של הפלט, כפי שמוצג:

image

 

אחרי שעשיתי את זה, כל div בשורה יפה, מיתוג הכרטיסיה שלי התחיל לעבוד.

כמו תמיד, אני מקווה שזה עוזר למישהו בצרה.

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

אבל נוספים, jQuery–שינוי גודל של תמונה לדוגמה

אני בירושה של ה-web part של הספק הישן של לקוח, ויש בעיה של גודל התמונה.  התמונות צריכה להיות 60×50 אך מסיבה כלשהי אי-זוגי, הספק המקורי אילצה אותם לתוך 42×42, כך שהם נראים squashed:

 

תמונה טובה

התמונה רע

הנה סימון (מעט פשוטה):

<טבלה class = 'מורחב-outlook'>
  <thead>
    <. tr>
      <th  רוחב ='100′>3 שלישי</th>
    </. tr>
  </thead>

  <tbody>
    <מחלקה tr = 'תחזית'>
      <td רוחב ='100′>
        <ul>
          <li class = "גבוה">גבוהה: 72&מעלות;F</li>
          <li class = "נמוכה">נמוך: 44&מעלות;F</li>
          <li class = 'תנאי'>סאני
            <img src =’
http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/trans/cond007.png’ רוחב = 42’ גובה = 42’ alt =” />
          </li>
        </ul>
      </td>
    </. tr>

  </tbody>

</טבלה>

ותשימו לב זה אפילו הנתיב של התמונה עצמה מציג את המימד הנכון (60×50) הספק המקורי כפה את זה 42×42.  ? למה?  משוגע.

בכל מקרה, . רציתי פתרון מהיר וקל לבעיה זו, פניתי jQuery.  הטריק היה כדי לאתר המתאים <img> תגים.  לא רציתי באפס מעשה עם כל תגי img אחרים (אשר הם רבים).  את הקטע הזה של jQuery עשה את העבודה:

<סקריפט סוג = טקסט/javascript"" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></קובץ script>

<סקריפט סוג = "טקסט/javascript">
     $(המסמך).מוכן(פונקציה () {

         $(' li.condition > img').כל(פונקציה (אינדקס, פריט)
           
{
             $(פריט).css("רוחב", "60"); 
             $(פריט).css("גובה", "50");
            });
     }); // במשלוח המסמך
</קובץ script>

? פיסת קוד מוצא את האוסף <li> תגיות שלו הינה "תנאי", <img> . ילדים.  זה ואז סובבת בין כל זה.  עבד כמו קסם.

אני כנראה יכול לייעל את זה, אבל אף פעם לא הייתי בחור unix זה נפתר π כדי 18 דיוק ספרות באמצעות שקיעת דם ואתה תקבל את המגיע, ואני לא כזו אם jQuery? בחור חיוך.

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

שליטה של אישור והלחצנים ביטול

אני כתבתי מאמר זה לפני זמן מה, אבל נראה לי לא לקשר אליו בבלוג של אזור זמן, שהעיר:

image

מאמר זה מתאר כיצד לכפות newform. aspx כדי לנתב מחדש לעמוד אחד, כאשר המשתמש לוחץ על אישור, דף אחר כאשר היא לוחץ על ביטול.

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin

עצה מהירה: הוספת jQuery דפי פרסום של איזוב

כאשר שיפור מוס publising דפי משתמש jQuery, אני מכה את החשק הבאים:

שגיאת שרת ב- ' /’ יישום.


שגיאת מנתח

תיאור: אירעה שגיאה במהלך ניתוח המבנה של משאב הנדרש כדי לשרת בקשה זו. אנא עיין בפרטי השגיאה הפרישה הספציפיים הבאים ושנה בהתאם לבצע את קובץ המקור שלך.

הודעת שגיאת פורש: רק פקדי תוכן מותרים ישירות בדף תוכן המכיל פקדי תוכן.

שגיאת מקור:

 
Line 10: 
Line 11: 
Line 12: <script 
Line 13:     type="text/javascript" 
Line 14:     src="/jQuery/jquery-1.4.min.js"> 

קובץ המקור: /_catalogs/masterpage/KCC_FacultyMember.aspx    קו: 12


פרטי הגירסה: Microsoft.NET Framework גירסה:2.0.50727.4927; ASP.NET גירסה:2.0.50727.4927

זה היה קל מספיק לתקן (h/t כדי העמית שלי, Ethirajulu אודאי).  ודא הקוד jQuery חי בתוך "PlaceHolderAdditionalPageHead" כפי שמוצג:

<asp:תוכן ContentPlaceholderID = "PlaceHolderAdditionalPageHead" runat = "שרת">

<קובץ script

    סוג = "טקסט/javascript"

    src="/jQuery/jquery-1.4.min.js">

</קובץ script>

<סקריפט סוג = "טקסט/javascript">

  $(המסמך).מוכן(פונקציה() {

   // החומר מבריק jQuery נכנס כאן.

   });

</קובץ script>

</קצה>

מנוי על הבלוג שלי.

עקוב אחרי הטוויטר ב http://www.twitter.com/pagalvin