使用ajax的MVC多级联下拉过滤表

时间:2016-12-25 16:04:01

标签: jquery ajax asp.net-mvc sorting

我想有多个下拉列表来过滤同一页面上的表格。当您转到页面时,它会在您选择第一个下拉列表时显示一个表格,它会缩小数据并更新第二个下拉列表。

以下是我在MVC Sort headers and Dropdown Ajax update

上工作的示例

我可以让级联下拉列表正常工作,或者我可以让表格更新,但我无法获得两者。

我正在尝试使用ajax,因此页面无法重新加载。

任何指导或示例都会很棒!

1 个答案:

答案 0 :(得分:0)

我还没有看到你的代码,所以无法确切地说出问题。以下是我看到您的解决方案的方式。首先将第二个下拉值添加到过滤器方法中,未选择时应该具有默认值。

  <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_login"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
tools:context="in.thoughtsmith.jobsmith.LoginActivity">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/MessageText"
    android:visibility="invisible"/>

<com.google.android.gms.common.SignInButton
    android:id="@+id/Sign_In_Button"
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    />

<Button
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    android:text="@string/ProceedWithoutLogIn"
    android:onClick="proceedWithOutLogin"
    />

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Logout"
    android:id="@+id/LogoutButton"
    android:onClick="logout"
    android:visibility="invisible"/>

</LinearLayout>

然后检查是否选择了第二个,在这种情况下是否为0,并过滤

import android.content.Intent;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

import com.google.android.gms.auth.api.Auth;
import com.google.android.gms.auth.api.signin.GoogleSignInAccount;
import com.google.android.gms.auth.api.signin.GoogleSignInOptions;
import com.google.android.gms.auth.api.signin.GoogleSignInResult;
import com.google.android.gms.common.ConnectionResult;
import com.google.android.gms.common.SignInButton;
import com.google.android.gms.common.api.GoogleApiClient;
import com.google.android.gms.common.api.ResultCallback;
import com.google.android.gms.common.api.Status;

public class LoginActivity extends AppCompatActivity implements 
View.OnClickListener, GoogleApiClient.OnConnectionFailedListener {

GoogleSignInOptions googleSignInOptions;
GoogleApiClient googleApiClient;
private final int REQUEST_CODE = 1;
TextView messageTextView;
SignInButton signInButton;
Button logoutButton;


 @Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_login);

    messageTextView = (TextView) findViewById(R.id.MessageText);
    signInButton = (SignInButton) findViewById(R.id.Sign_In_Button);
    signInButton.setOnClickListener(this);
    logoutButton = (Button) findViewById(R.id.LogoutButton);
    logoutButton.setOnClickListener(this);

    googleSignInOptions = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN)
            .requestEmail()
            .build();

    googleApiClient = new GoogleApiClient.Builder(this)
            .enableAutoManage(this, this)
            .addApi(Auth.GOOGLE_SIGN_IN_API, googleSignInOptions)
            .build();


}

 @Override
public void onClick(View view) {
    switch (view.getId()) {
        case R.id.Sign_In_Button:
            Intent intent = Auth.GoogleSignInApi.getSignInIntent(googleApiClient);
            startActivityForResult(intent, REQUEST_CODE);
            break;
        case R.id.LogoutButton:
            Auth.GoogleSignInApi.signOut(googleApiClient).setResultCallback(new ResultCallback<Status>() {
                @Override
                public void onResult(@NonNull Status status) {
                    messageTextView.setText("SuccessfullyLogout");
                    logoutButton.setVisibility(View.INVISIBLE);
                }
            });
            break;
    }
}

  @Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);

    if (requestCode == REQUEST_CODE) {
        GoogleSignInResult googleSignInResult = Auth.GoogleSignInApi.getSignInResultFromIntent(data);
        hanleSigninIntent(googleSignInResult);
    }
}

public void hanleSigninIntent(GoogleSignInResult googleSignInResult) {
    if (googleSignInResult.isSuccess()) {
        GoogleSignInAccount userAccount = googleSignInResult.getSignInAccount();
        updateUi(getString(R.string.WelcomeMessage) + " " + userAccount.getDisplayName());
        logoutButton.setVisibility(View.VISIBLE);
    } else {
        updateUi(getString(R.string.UserNameOrPasswordWrong));
    }

}


public void updateUi(String message) {
    messageTextView.setText(message);
    messageTextView.setVisibility(View.VISIBLE);
}

@Override
public void onConnectionFailed(@NonNull ConnectionResult connectionResult) {
    Toast.makeText(this, "OnConnectionFailed", Toast.LENGTH_SHORT);
}
}

添加另一个方法,返回第二个方法的项目列表,并在更改第一个下拉值时调用它。最佳选项是JSON格式的返回值。 这是我的代码,我在更改类别时更新子类别列表

    public ActionResult Index(string sortOrder, string id, 
                              string channelLocation, int secon_ddl = 0)

我正在使用jquery数据表,因此更新表很简单

    if(secon_ddl != 0)
    {
       //do whatever
    } 

在你的情况下,这最后一个代码应该是完全不同的。只需确保您的过滤器mehtod接收到两个下拉列表的值,并在其中一个下拉列表更改时触发。希望这可以帮助你!!