जावास्क्रिप्ट/jQuery

Question

के साथ किसी फ़ॉर्म की क्रिया को बदलना मुझे एक समस्या है जो मुझे पागल कर रही है। मैं फेसबुक का समर्थन करने के लिए ओपनिड-चयनकर्ता को संशोधित करने की कोशिश कर रहा हूं। मैं अपने प्रदाता के रूप में RPXNow का उपयोग कर रहा हूं, इसलिए इसे मानक की तुलना में फ़ॉर्म को एक अलग यूआरएल में सबमिट करने की आवश्यकता है।

उदाहरण के लिए

। RpxNow इस तरह मेरी प्रपत्र सेटअप करने के लिए मुझे आवश्यकता है:

<form action="https://wikipediamaze.rpxnow.com/openid/start?token_url=...">

यह फेसबुक और माइस्पेस के अलावा प्रत्येक प्रदाता के लिए काम करता है। उन की आवश्यकता प्रपत्र इस तरह एक अलग यूआरएल के लिए तैनात किया जाना है:

<form action="https://wikipediamaze.rpxnow.com/facebook/start?token_url=...">

और

<form action="https://wikipediamaze.rpxnow.com/myspace/start?token_url=...">

खुला आईडी चयनकर्ता प्रपत्र पर बटन का एक समूह है प्रत्येक openid प्रदाताओं का प्रतिनिधित्व । मैं जो करने की कोशिश कर रहा हूं वह पता लगाता है कि फेसबुक या माइस्पेस बटन पर क्लिक होने पर सबमिट करने से पहले फॉर्म पर कार्रवाई को बदल दिया गया है। हालांकि यह काम नहीं कर रहा है। मेरा कोड यहाँ है।

मैं सभी एक ही "समर्थित नहीं" अपवाद

$("#openid_form").attr("action", form_url) 
document.forms[0].action = form_url 

कोई सुझाव के साथ कई रूप की कोशिश की है?

अद्यतन

यहाँ कोड के बारे में अधिक विवरण दिए गए हैं। मैंने कुछ को अल्पसंख्यक के लिए छोड़ दिया है। एकमात्र चीज जो मैंने किया है, उसे "प्रदाता_लार्ज" ऑब्जेक्ट (जो सफलतापूर्वक वेबसाइट पर लोगो जोड़ता है) में फेसबुक अनुभाग जोड़ा गया है, और उपयोगकर्ता की पहचान करने वाले यूआरएल की आपूर्ति करने के बजाय, मैं "form_url" नामक एक संपत्ति बना रहा हूं, मैं अपने फॉर्म की कार्रवाई को सेट करना चाहता हूं। यदि आप अनुभाग प्रदाता "प्रदाता छवि क्लिक" देखते हैं तो आप देखेंगे कि मैं "form_url" संपत्ति की उपस्थिति के लिए कहां जांच कर रहा हूं और कार्रवाई को बदलने और फ़ॉर्म सबमिट करने के लिए jQuery का उपयोग कर रहा हूं। हालांकि जब मैं डीबग मोड में जावास्क्रिप्ट को चलाता हूं तो यह मुझे बताता है कि यह एक अवैध ऑपरेशन है।

var providers_large = { 
    google: { 
     name: 'Google', 
     url: 'https://www.google.com/accounts/o8/id' 
    }, 
    facebook: { 
     name: 'Facebook', 
     form_url: 'http://wikipediamaze.rpxnow.com/facebook/start?token_url=http://www.wikipediamaze.com/Accounts/Logon' 
    }, 

}; 
var providers_small = { 
    myopenid: { 
     name: 'MyOpenID', 
     label: 'Enter your MyOpenID username.', 
     url: 'http://{username}.myopenid.com/' 
    }, 
    livejournal: { 
     name: 'LiveJournal', 
     label: 'Enter your Livejournal username.', 
     url: 'http://{username}.livejournal.com/' 
    }, 
    flickr: { 
     name: 'Flickr',   
     label: 'Enter your Flickr username.', 
     url: 'http://flickr.com/{username}/' 
    }, 
    technorati: { 
     name: 'Technorati', 
     label: 'Enter your Technorati username.', 
     url: 'http://technorati.com/people/technorati/{username}/' 
    }, 
    wordpress: { 
     name: 'Wordpress', 
     label: 'Enter your Wordpress.com username.', 
     url: 'http://{username}.wordpress.com/' 
    }, 
    blogger: { 
     name: 'Blogger', 
     label: 'Your Blogger account', 
     url: 'http://{username}.blogspot.com/' 
    }, 
    verisign: { 
     name: 'Verisign', 
     label: 'Your Verisign username', 
     url: 'http://{username}.pip.verisignlabs.com/' 
    }, 
    vidoop: { 
     name: 'Vidoop', 
     label: 'Your Vidoop username', 
     url: 'http://{username}.myvidoop.com/' 
    }, 
    verisign: { 
     name: 'Verisign', 
     label: 'Your Verisign username', 
     url: 'http://{username}.pip.verisignlabs.com/' 
    }, 
    claimid: { 
     name: 'ClaimID', 
     label: 'Your ClaimID username', 
     url: 'http://claimid.com/{username}' 
    } 
}; 
var providers = $.extend({}, providers_large, providers_small); 

var openid = { 

     cookie_expires: 6*30, // 6 months. 
     cookie_name: 'openid_provider', 
     cookie_path: '/', 

     img_path: 'images/', 

     input_id: null, 
     provider_url: null, 

    init: function(input_id) { 

     var openid_btns = $('#openid_btns'); 

     this.input_id = input_id; 

     $('#openid_choice').show(); 
     $('#openid_input_area').empty(); 

     // add box for each provider 
     for (id in providers_large) { 

       openid_btns.append(this.getBoxHTML(providers_large[id], 'large', '.gif')); 
     } 
     if (providers_small) { 
       openid_btns.append('<br/>'); 

       for (id in providers_small) { 

         openid_btns.append(this.getBoxHTML(providers_small[id], 'small', '.ico')); 
       } 
     } 

     $('#openid_form').submit(this.submit); 

     var box_id = this.readCookie(); 
     if (box_id) { 
       this.signin(box_id, true); 
     } 
    }, 
    getBoxHTML: function(provider, box_size, image_ext) { 

     var box_id = provider["name"].toLowerCase(); 
     return '<a title="'+provider["name"]+'" href="javascript: openid.signin(\''+ box_id +'\');"' + 
         ' style="background: #FFF url(' + this.img_path + box_id + image_ext+') no-repeat center center" ' + 
         'class="' + box_id + ' openid_' + box_size + '_btn"></a>';  

    }, 
    /* Provider image click */ 
    signin: function(box_id, onload) { 

     var provider = providers[box_id]; 
       if (! provider) { 
         return; 
       } 

       this.highlight(box_id); 
       this.setCookie(box_id); 

       // prompt user for input? 
       if (provider['label']) { 

         this.useInputBox(provider); 
         this.provider_url = provider['url']; 

       } 
       else if(provider['form_url']) { 

         $('#openid_form').attr("action", provider['form_url']); 
         $('#openid_form').submit(); 
       } 
       else { 

         this.setOpenIdUrl(provider['url']); 
         if (! onload) { 
           $('#openid_form').submit(); 
         }  
       } 
    }, 
    /* Sign-in button click */ 
    submit: function() { 

     var url = openid.provider_url; 
     if (url) { 
       url = url.replace('{username}', $('#openid_username').val()); 
       openid.setOpenIdUrl(url); 
     } 
     return true; 
    }, 
    setOpenIdUrl: function (url) { 

     var hidden = $('#'+this.input_id); 
     if (hidden.length > 0) { 
       hidden.value = url; 
     } else { 
       $('#openid_form').append('<input type="hidden" id="' + this.input_id + '" name="' + this.input_id + '" value="'+url+'"/>'); 
     } 
    }, 
    highlight: function (box_id) { 

     // remove previous highlight. 
     var highlight = $('#openid_highlight'); 
     if (highlight) { 
       highlight.replaceWith($('#openid_highlight a')[0]); 
     } 
     // add new highlight. 
     $('.'+box_id).wrap('<div id="openid_highlight"></div>'); 
    }, 
    setCookie: function (value) { 

       var date = new Date(); 
       date.setTime(date.getTime()+(this.cookie_expires*24*60*60*1000)); 
       var expires = "; expires="+date.toGMTString(); 

       document.cookie = this.cookie_name+"="+value+expires+"; path=" + this.cookie_path; 
    }, 
    readCookie: function() { 
       var nameEQ = this.cookie_name + "="; 
       var ca = document.cookie.split(';'); 
       for(var i=0;i < ca.length;i++) { 
         var c = ca[i]; 
         while (c.charAt(0)==' ') c = c.substring(1,c.length); 
         if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
       } 
       return null; 
    }, 
    useInputBox: function (provider) { 

       var input_area = $('#openid_input_area'); 

       var html = ''; 
       var id = 'openid_username'; 
       var value = ''; 
       var label = provider['label']; 
       var style = ''; 

       if (label) { 
         html = '<p>' + label + '</p>'; 
       } 
       if (provider['name'] == 'OpenID') { 
         id = this.input_id; 
         value = 'http://'; 
         style = 'background:#FFF url('+this.img_path+'openid-inputicon.gif) no-repeat scroll 0 50%; padding-left:18px;'; 
       } 
       html += '<input id="'+id+'" type="text" style="'+style+'" name="'+id+'" value="'+value+'" />' + 
             '<input id="openid_submit" type="submit" value="Sign-In"/>'; 

       input_area.empty(); 
       input_area.append(html); 

       $('#'+id).focus(); 
    } 
}; 

Answer 1

jQuery (1.4.2) भ्रमित हो जाता है यदि आपके पास "क्रिया" नामक कोई भी फ़ॉर्म तत्व है। आप डीओएम विशेषता विधियों का उपयोग कर इसके आसपास हो सकते हैं या बस "एक्शन" नामक फॉर्म तत्वों से बच सकते हैं।

<form action="foo"> 
    <button name="action" value="bar">Go</button> 
</form> 

<script type="text/javascript"> 
    $('form').attr('action', 'baz'); //this fails silently 
    $('form').get(0).setAttribute('action', 'baz'); //this works 
</script> 

Answer 2

मैं पाओलो से सहमत हूं कि हमें और कोड देखने की आवश्यकता है। मैंने इस अत्यधिक सरलीकृत उदाहरण का परीक्षण किया और यह काम किया। इसका मतलब है कि यह फ्लाई पर फॉर्म एक्शन को बदलने में सक्षम है।

<script type="text/javascript"> 
function submitForm(){ 
    var form_url = $("#openid_form").attr("action"); 
    alert("Before - action=" + form_url); 
    //changing the action to google.com 
    $("#openid_form").attr("action","http://google.com"); 
    alert("After - action = "+$("#openid_form").attr("action")); 
    //submit the form 
    $("#openid_form").submit(); 
} 
</script> 


<form id="openid_form" action="test.html"> 
    First Name:<input type="text" name="fname" /><br/> 
    Last Name: <input type="text" name="lname" /><br/> 
    <input type="button" onclick="submitForm()" value="Submit Form" /> 
</form> 

संपादित करें: मैं अद्यतन कोड आप पोस्ट का परीक्षण किया और providers_large की घोषणा में एक सिंटैक्स त्रुटि पाया। एक अतिरिक्त कॉमा है। फ़ायरफ़ॉक्स इस मुद्दे को अनदेखा करता है, लेकिन IE8 एक त्रुटि फेंकता है।

var providers_large = { 
    google: { 
     name: 'Google', 
     url: 'https://www.google.com/accounts/o8/id' 
    }, 
    facebook: { 
     name: 'Facebook', 
     form_url: 'http://wikipediamaze.rpxnow.com/facebook/start?token_url=http://www.wikipediamaze.com/Accounts/Logon' 
    }, //<-- Here's the problem. Remove that comma 

}; 

Answer 3

आप वास्तव में सिर्फ

$("#form").attr("target", "NewAction"); 

जहाँ तक मुझे पता के रूप में उपयोग कर सकते हैं, इस चुपचाप असफल नहीं होगा।

यदि पृष्ठ एक नए लक्ष्य में खुल रहा है, तो आपको यह सुनिश्चित करने की आवश्यकता हो सकती है कि यूआरएल प्रत्येक बार अद्वितीय है क्योंकि वेबकिट (क्रोम/सफारी) उस यूआरएल का दौरा करने वाले तथ्य को कैश करेगा और पोस्ट नहीं करेगा।

उदाहरण के लिए

$("form").attr("action", "/Pages/GeneratePreview?" + new Date().getMilliseconds()); 

Answer 4

सिर्फ Tamlyn क्या लिखा है,
के बजाय करने के लिए एक विवरण जोड़ने के लिए $('form').get(0).setAttribute('action', 'baz'); //this works

$('form')[0].setAttribute('action', 'baz');
काम करता है समान रूप से अच्छी तरह से

Answer 5

बस इस के लिए एक अद्यतन - मैं jQuery के साथ एक फॉर्म की क्रिया विशेषता अद्यतन करने में एक ही समस्या हो रही है।

कुछ परीक्षणों के बाद यह पता चला है कि आदेश: $ ('# myForm')। Attr ('action', 'new_url.html');

चुपचाप विफल रहता है यदि फॉर्म की क्रिया विशेषता खाली है। यदि मैं कुछ पाठ रखने के लिए अपने फॉर्म की क्रिया विशेषता अद्यतन करता हूं, तो jquery काम करता है।

Answer 6

उपयोग जावा स्क्रिप्ट मेरे लिए कार्रवाई url बदलने के लिए गतिशील रूप से निर्माण अच्छी तरह से

function chgAction(action_name) 
{ 

{% for data in sidebar_menu_data %} 

    if(action_name== "ABC"){ document.forms.action = "/ABC/"; 
    } 
    else if(action_name== "XYZ"){ document.forms.action = "/XYZ/"; 
    } 

}

<form name="forms" method="post" action="<put default url>" onSubmit="return checkForm(this);">{% csrf_token %}