2012-02-09 21 views
5

का उपयोग कर एक वेब विधि में तर्कों की संख्या को छोटा करना इस प्रश्न के लिए, मैं सी #, एक वेब सेवा और jQuery में एएसपी.NET वेब फॉर्म का उपयोग कर रहा हूं। I read this post jQuery AJAX का उपयोग कर वेब विधि में पैरामीटर के गुच्छा में पास करने के लिए सरणी का उपयोग करने के बारे में। मैं सोच रहा हूं कि सूचकांक का उपयोग किये बिना एक ही चीज़ करना संभव है। सूचकांक के साथ समस्या यह है कि ऑर्डर मायने रखता है और अपडेट करना एक परेशानी है क्योंकि इसमें क्लाइंट-स्क्रिप्ट और वेब विधि के तर्क अपडेट करना शामिल है। मैं वर्तमान में नामित तर्कों का उपयोग कर रहा हूं, लेकिन यह बहुत कठिन है। मेरी सबसे बड़ी वेब विधि में 20 तर्क हैं! नीरस मैं आदेश के बारे में परवाह किए बिना यहां एक शॉर्टकट की तलाश में हूं। क्या यह संभव है?jQuery AJAX

var obj = {}; 

// Iterate through each table row and add the editor field data to an object. 
$('.addressRow').each(function() 
{ 
    var row = $(this); 
    var addressField = row.find('.addressField'); 
    var attr = addressField.attr('addressFieldName'); 
    var val = addressField.val() 
    obj[attr] = val; 
}); 

$.ajax(
{ 
    type: 'POST', 
    url: '/WebServices/AddressService.asmx/SaveAddress', 
    data: JSON.stringify(obj), 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    success: function (response) 
    { 
     alert('address saved'); 
    }, 
    error: function (response) 
    { 
     alert('error'); 
    } 
}); 



[WebMethod] 
public void SaveAddress(string streetAddress1, string streetAddress2, string apartmentNumber, string city, strng state, string zipCode, string country) 
{ 
    // save address... 
} 

अद्यतन:

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

उपयोग एक गुमनाम json ब्लॉब की एक सूची यानी -

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Web Service Demo</title> 
    <style type="text/css"> 
     * { font-family: "Segoe UI"; font-size: 12px; color: #444444; } 
     #result1 { padding: 10px 0px; } 
    </style> 
    <script type="text/javascript" src="Scripts/jquery.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() 
     { 
      $('button').click(function() 
      { 
       // NOTE: When using JavaScript objects, the properties MUST match the C# properties EXACTLY (casing and seplling). 
       // I.e. in employee.FirstName, FirstName maps EXACTLY to the FirstName in the C# Employee object. 

       // Create a employee object using the assigning to properties method. 
       var employee1 = {}; 
       employee1.ID = 5416; 
       employee1.FirstName = 'Fred'; 
       employee1.LastName = 'Baker'; 
       employee1.BirthDate = '07/18/1982'; 
       employee1.StreetAddress = '947 River Street'; 
       employee1.City = 'Somnerville'; 
       employee1.State = 'AR'; 
       employee1.ZipCode = '41370'; 

       // A property has the ability to be a list or complex type. In this example, employee1 uses a list of access codes and employee2 does not. 
       employee1.AccessCodes = new Array(); 
       employee1.AccessCodes[0] = 512; 
       employee1.AccessCodes[1] = 887; 

       // Create a employee object using the associative array method. 
       var employee2 = 
       { 
        ID: 3316, 
        FirstName: 'Jason', 
        LastName: 'Masters', 
        BirthDate: '11/19/1980', 
        StreetAddress: '11 South Crane Avenue', 
        City: 'New York', 
        State: 'NY', 
        ZipCode: '01147' 

        // employee2 does no use any access codes. AccessCodes in the C# web method is a list and by excluding it from the JavaScript 
        // object, the C# code defaults the list to the null. 
       }; 

       // In order to pass a complex JavaScript object to a web method as a complex type, the JavaScript object needs to be JSONified. 
       // The name of the argument in the C# web method MUST be included here in single quotes EXACTLY (casing and spelling) the same way 
       // the argument is specified in the C# code. In this example, the web method is "public string GetEmployeeData(Employee employee)". The 
       // complex argument is 'employee'. IT IS VITALLY IMPORTANT that, when using the JSON.stringify() function, the name of the web method 
       // argument is included here exactly the same way as specified in the C# code. I know I'm being redundant by repeating myself, but 
       // it took me hours to figure out how to do this and the error message from doing this improperly is completely useless! 

       var data1 = JSON.stringify({ 'employee': employee1 }); // 'employee' is the web method argument and employee1 is the JavaScript object from above. 
       var data2 = JSON.stringify({ 'employee': employee2 }); // 'employee' is the web method argument and employee2 is the JavaScript object from above. 

       // Send employee1 to the web method. 
       $.ajax(
       { 
        type: 'POST', 
        url: '/WebServices/WebService1.asmx/GetEmployeeData', 
        data: data1, 
        contentType: 'application/json; charset=utf-8', 
        dataType: 'json', 
        success: function (response) 
        { 
         $('#result1').html(response.d); 
        }, 
        error: function (response) 
        { 
         $('#result1').html('web service call failure\n' + response.responseText); 
        } 
       }); 

       // Send employee2 to the web method. 
       $.ajax(
       { 
        type: 'POST', 
        url: '/WebServices/WebService1.asmx/GetEmployeeData', 
        data: data2, 
        contentType: 'application/json; charset=utf-8', 
        dataType: 'json', 
        success: function (response) 
        { 
         $('#result2').html(response.d); 
        }, 
        error: function (response) 
        { 
         $('#result2').html('web service call failure\n' + response.responseText); 
        } 
       }); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <p>This demo shows how to pass a complex JSON object to a web method and get a reponse back from the web method.</p> 
     <p>1) It creates two JavaScript objects.</p> 
     <p>2) The JavaScript objects are JSONified and sent to the web method.</p> 
     <p>3) The web method receives the complex objects and uses them to create response text.</p> 
     <p>4) When the callback function fires, it displays the text returned from the web service.</p> 
     <button type="button">Call Web Service</button> 
     <div id="result1"></div> 
     <div id="result2"></div>    
    </div> 
    </form> 
</body> 
</html> 

[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
[ToolboxItem(false)] 
[ScriptService] 
public class WebService1 : WebService 
{ 
    [WebMethod] 
    public string GetEmployeeData(Employee employee) 
    { 
     var output = string.Format("Employee #{0}: {1} {2} lives at {3} in {4}, {5} with a zip code of {6} and was born on {7}.", employee.ID, employee.FirstName, employee.LastName, employee.StreetAddress, employee.City, employee.State, employee.ZipCode, employee.BirthDate.ToShortDateString()); 

     if (employee.AccessCodes != null) 
     { 
      output += string.Format(" Employee #{0} has access codes: ", employee.ID); 

      foreach (var accessCode in employee.AccessCodes) 
      { 
       output += accessCode + " , "; 
      } 

      output = output.Substring(0, output.Length - 2); 
     } 
     else 
     { 
      output += string.Format(" Employee #{0} does not have any has access codes.", employee.ID); 
     } 

     return output; 
    } 
} 

public class Employee 
{ 
    public int ID { get; set; } 
    public string FirstName { get; set; } 
    public string LastName { get; set; } 
    public DateTime BirthDate { get; set; } 
    public string StreetAddress { get; set; } 
    public string City { get; set; } 
    public string State { get; set; } 
    public string ZipCode { get; set; } 
    public List<int> AccessCodes {get;set;} 
} 
+2

तुम सिर्फ विधि हस्ताक्षर छोटा करने के लिए चाहते हैं, आप एक कस्टम प्रकार का उपयोग करने के लिए स्विच कर सकते हैं:

<div id='Address'> <input class='streetAddress1' type='text'> <input class='streetAddress2' type='text'> <input class='apartmentNumber' type='text'> <input class='city' type='text'> <input class='state' type='text'> <input class='zipCode' type='text'> <input class='country' type='text'> </div> <div id='Address'> <input class='streetAddress1' type='text'> <input class='streetAddress2' type='text'> <input class='apartmentNumber' type='text'> <input class='city' type='text'> <input class='state' type='text'> <input class='zipCode' type='text'> <input class='country' type='text'> </div> <button id='savedata'>SaveData</button> 

यहाँ बचाने के लिए कुछ ग्राहक कोड है आप सर्वर पर परिभाषित करते हैं। फिर आप एक मिलान करने वाली जेएस ऑब्जेक्ट बना सकते हैं जिसे आप सर्वर पर भेज सकते हैं। यह क्लाइंट और सर्वर पर ऑब्जेक्ट को बनाए रखने के काम को कम नहीं करेगा, क्योंकि आपको अभी भी क्लाइंट और सर्वर पर ऑब्जेक्ट अपडेट करना होगा। – Zachary

उत्तर

2

नोट: यह उदाहरण आपको काम करने से पूरी तरह से नहीं रखेगा, लेकिन कुछ बदलाव होने पर आपको केवल कुछ स्थानों को बदलना होगा। सी # वर्ग बदलें और सहेजें विधि (और लेआउट शायद) बदलें।

सभी तत्वों के साथ सी # में एक "पता" वर्ग बनाएं, पते की एक सरणी बनाएं, फिर वेब विधि में पते की सूची (एकल पैरामीटर) को संभालें। मेरा उदाहरण कुछ हद तक समझा गया है लेकिन आपको एक प्रारंभिक स्थान देना चाहिए। मैंने पूरी तरह से इसका परीक्षण नहीं किया है लेकिन यह करीब होना चाहिए।

[WebMethod] 
public void SaveAddress(List<Address> Addresses) { 
// save em here 
} 

public class Address 
{ 
    public Address() 
    { 
     streetAddress1 = streetAddress2 = apartmentNumber = city = state = zipCode = country = String.Empty; 
    } 
    public String streetAddress1 { get; set; } 
    public String streetAddress2 { get; set; } 
    public String apartmentNumber { get; set; } 
    public String city { get; set; } 
    public String state { get; set; } 
    public String zipCode { get; set; } 
    public String country { get; set; } 
} 
इस लेआउट के साथ

:

function AddressRow(currentAddressRow) { 
    this.streetAddress1 = currentAddressRow.find('.streetAddress1').val(); 
    this.streetAddress2 = currentAddressRow.find('.streetAddress2').val(); 
    this.apartmentNumber = currentAddressRow.find('.apartmentNumber').val(); 
    this.city = currentAddressRow.find('.city').val(); 
    this.state = currentAddressRow.find('.state').val(); 
    this.zipCode = currentAddressRow.find('.zipCode').val(); 
    this.country = currentAddressRow.find('.country').val(); 
} 

function AddressRowSet() { 
    var addressRows = []; 
    var allAddressRows = $('.Address'); 
    var thisRow = null; 
    var currentRowCount = allAddressRows.length; 
    var i = 0; 
    for (i = 0; i < currentRowCount; i++) { 
     thisRow = allAddressRows.eq(i); 
     addressRows.push(new AddressRow(thisRow)); 
    } 
    this.AddressRows = addressRows; 
} 

function SaveCurrentAddresses() { 
    var AddressRecords = new AddressRowSet(); 
    var AddressesData = { 
     Addresses: AddressRecords.AddressRows 
    }; 
    SaveAddressData(JSON.stringify(AddressesData)); 
} 

function SaveAddressData(Addresses) { 
    $.ajax({ 
     type: 'POST', 
     data: Addresses, 
     contentType: 'application/json', 
     url: '/WebServices/AddressService.asmx/SaveAddress', 
     dataType: 'json', 
     success: function(response) { 
      alert('address saved'); 
     }, 
     error: function(response) { 
      alert('error'); 
     } 
    }); 
} 
$('#savedata').click(function() { 
    SaveCurrentAddresses(); 
}); 
+0

ध्यान दें कि यह JSON.stringify का उपयोग करता है, जो, यदि आवश्यक हो तो यहां पाया जा सकता है: http://www.json.org/json2.js (यह कुछ ब्राउज़रों में है) –

1

आप सरणियों उपयोग करने की आवश्यकता नहीं है - सरणियों संबंधित डेटा की एक सूची के भंडारण के लिए विशेष रूप से कर रहे हैं

var obj = { 
    param1: 'stringval1', 
    param2: 100, // int value, 
    param3: { 
     childobjparam1: 'this is a child object in json', 
     childobjparam2: true // boolean value 
    } 
}; 

तो फिर तुम सिर्फ json वस्तु में पारित कर सकते हैं इस प्रकार है:

$.ajax(
{ 
    type: 'POST', 
    url: '/WebServices/AddressService.asmx/SaveAddress', 
    data: obj, 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    success: function (response) 
    { 
     alert('address saved'); 
    }, 
    error: function (response) 
    { 
     alert('error'); 
    } 
}); 

JSON है प्यारा :)