序列化ListView数据以发送JSON POST

时间:2018-09-13 20:33:27

标签: c# xamarin xamarin.forms

我正在关注这个问题ListView Get Multiple Entry Values to validate and send,现在我需要序列化数据以将其发送到服务器,我已经做到了:

public class SurveyList
{
    public List<QuestionList> Questions { get; set; }
}

public class QuestionList
{
    public string QuestionLabel { get; set; }
    public string QuestionCode { get; set; }
}

public partial class SurveyPage : ContentPage
{
    private List<QuestionList> survey;

    public SurveyPage()
    {
        InitializeComponent();

        survey = new List<QuestionList>
        {
            new QuestionList { QuestionLabel = "Question 1?", QuestionCode = "01" },
            new QuestionList { QuestionLabel = "Question 2?", QuestionCode = "02" }
        };

        surveyList.ItemsSource = survey;
    }

    void Button_Clicked(object sender, System.EventArgs e)
    {
        HttpClient client = new HttpClient();

        client.BaseAddress = new Uri("http://myip");

        foreach (var getValues in survey)
        {
            Dictionary<string, string> listViewData = new Dictionary<string, string>()
            {
                { "Question", getValues.QuestionLabel },
                { "Answer", getValues.QuestionCode }
            };

            var listViewDataContent = new FormUrlEncodedContent(listViewData);

            var response = client.PostAsync("/api/GetData", listViewDataContent);
        }

    }
}

请帮助我正确获取所有要通过POST发送的数据。由于我获取的数据是动态的,因此不确定如何收集所有数据。

注意:那里显示的数据是静态的,但应该是从相同的API获取数据

谢谢

编辑:添加我的Xaml代码

<ListView x:Name="surveyList"
      HasUnevenRows="true"
      SeparatorVisibility="Default" 
      BackgroundColor="White">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout Padding="10" BackgroundColor="Purple">
                    <StackLayout Spacing="10" VerticalOptions="Start" HorizontalOptions="FillAndExpand" BackgroundColor="Olive">
                        <Label Text="{Binding QuestionLabel}" TextColor="Navy"/>
                        <Picker x:Name="QuestionPicker">
                            <Picker.Items>
                                <x:String>Yes</x:String>
                                <x:String>No</x:String>
                            </Picker.Items>
                        </Picker>
                    </StackLayout>
                    <StackLayout Spacing="20" VerticalOptions="End" HorizontalOptions="FillAndExpand" BackgroundColor="Maroon">
                    <Button x:Name="surveyButton"
                            Text="Enviar"
                            TextColor="White"
                            BackgroundColor="{StaticResource dpGreen}"
                            Clicked="Handle_Clicked"/>
                    </StackLayout>
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
    <ListView.Footer>
        <Button x:Name="surveyButton"
            Text="Send"
            TextColor="White"
            BackgroundColor="Teal"
            Clicked="Handle_Clicked" />
    </ListView.Footer>
</ListView>

1 个答案:

答案 0 :(得分:2)

您不必手动编写Json,还有其他方法可以完成。

首先,将您的QuestionList对象修改为具有另一个称为Answer的字段,或者您更喜欢调用它。

public class QuestionList
{
    public string QuestionLabel { get; set; }
    public string QuestionCode { get; set; }
    public string Answer { get; set; }
}

此新属性将保留答案的值。

第二:将List<QuestionList>更改为ObservableCollection

此处:

private ObservableCollection<QuestionList> survey;

和此处

survey = new ObservableCollection<QuestionList>
{
    new QuestionList { QuestionLabel = "Question 1?", QuestionCode = "01" },
    new QuestionList { QuestionLabel = "Question 2?", QuestionCode = "02" }
};

稍微更改一下XAML。将Answer绑定到Picker SelectedItem。这是“魔术”发生的地方。

<Picker x:Name="QuestionPicker" 
        SelectedItem="{Binding Answer, Mode=TwoWay}">
    <Picker.Items>
        <x:String>Yes</x:String>
        <x:String>No</x:String>
    </Picker.Items>
</Picker>

每次用户从Picker中选择一个值时,它将自动更新您设置为Answer的列表的ItemsSource属性。有关绑定here

的更多信息

现在,您只需更改Button Clicked事件,并使用此行代码即可完成Json。 (首先,您需要安装Newtonsoft Nugget

Here一个教程,显示了如何安装金块包(碰巧的是,他们使用相同的库作为示例,很幸运!)。

var json = JsonConvert.SerializeObject(survey);

上面将创建具有以下格式的json:

[
    {
        "QuestionLabel":"Question 1",
        "QuestionCode" : "01",
        "Answer":"No"
    },
    {
        "QuestionLabel":"Question 2",
        "QuestionCode" : "02",
        "Answer":"Yes"
    },
    {
        "QuestionLabel":"Question 3",
        "QuestionCode" : "03",
        "Answer":"Yes"
    },
    {
        "QuestionLabel":"Question 4",
        "QuestionCode" : "04",
        "Answer":"Yes"
    },
    {
        "QuestionLabel":"Question 5",
        "QuestionCode" : "05",
        "Answer":"No"
    }
]

如您所见,这代表一个QuestionList数组,您的服务器端点应将其作为请求正文。为了清楚起见,我用随机值填充了Answer

整个Click事件代码看起来像

void Button_Clicked(object sender, System.EventArgs e)
{
    using(var client = new HttpClient())
    {
        client.BaseAddress = new Uri("http://myip");

        var json = JsonConvert.SerializeObject(survey);

        var listViewDataContent = new FormUrlEncodedContent(json);
        var response = client.PostAsync("/api/GetData", listViewDataContent);
    }
}

注意:请注意,我对初始化HttpClient的方式做了一些更改。是的,我知道this文档存在,但是无论如何,每次单击按钮都在创建一个新实例,因为这不是问题的一部分,以免我们看不到它。

注2:将值与服务器在json中期望的值匹配。这里重要的是向您展示使用 Xamarin.Forms 绑定可以从ListView中获取值,并且通过 Newtownsoft.Json 可以轻松地获取值。将您的数据从 C#对象转换为 Json 。有关此库here的更多信息。

希望这会有所帮助。-